!253 合并master上1.8.2的修改到master-vxe

Merge pull request !253 from clockdotnet/master-vxe

.eslintrc.js

@@ -22,7 +22,8 @@ module.exports = defineConfig({
     'plugin:vue/vue3-recommended',
     'plugin:@typescript-eslint/recommended',
     'prettier',
-    'plugin:prettier/recommended'
+    'plugin:prettier/recommended',
+    '@unocss'
   ],
   rules: {
     'vue/script-setup-uses-vars': 'error',

README.md

@@ -40,13 +40,13 @@
 |----------------------------------------------------------------------|------------------|--------|
 | [Vue](https://staging-cn.vuejs.org/)                                 | Vue 框架           | 3.3.4 |
 | [Vite](https://cn.vitejs.dev//)                                      | 开发与构建工具          | 4.4.9  |
-| [Element Plus](https://element-plus.org/zh-CN/)                      | Element Plus     | 2.3.12 |
+| [Element Plus](https://element-plus.org/zh-CN/)                      | Element Plus     | 2.3.14 |
-| [TypeScript](https://www.typescriptlang.org/docs/)                   | JavaScript 的超集   | 5.1.6  |
+| [TypeScript](https://www.typescriptlang.org/docs/)                   | JavaScript 的超集   | 5.2.2  |
 | [pinia](https://pinia.vuejs.org/)                                    | Vue 存储库 替代 vuex5 | 2.1.6 |
 | [vueuse](https://vueuse.org/)                                        | 常用工具集            | 10.4.1 |
-| [vue-i18n](https://kazupon.github.io/vue-i18n/zh/introduction.html/) | 国际化              | 9.2.2  |
+| [vue-i18n](https://kazupon.github.io/vue-i18n/zh/introduction.html/) | 国际化              | 9.4.1  |
-| [vue-router](https://router.vuejs.org/)                              | Vue 路由           | 4.2.4  |
+| [vue-router](https://router.vuejs.org/)                              | Vue 路由           | 4.2.5  |
-| [unocss](https://uno.antfu.me/)                                      | 原子 css          | 0.55.7  |
+| [unocss](https://uno.antfu.me/)                                      | 原子 css          | 0.56.1  |
 | [iconify](https://icon-sets.iconify.design/)                         | 在线图标库            | 3.1.1  |
 | [wangeditor](https://www.wangeditor.com/)                            | 富文本编辑器           | 5.1.23 |
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "yudao-ui-admin-vue3",
-  "version": "1.8.1-snapshot",
+  "version": "1.8.2-snapshot",
   "description": "基于vue3、vite4、element-plus、typesScript",
   "author": "xingyu",
   "private": false,
@@ -34,20 +34,20 @@
     "@vueuse/core": "^10.4.1",
     "@wangeditor/editor": "^5.1.23",
     "@wangeditor/editor-for-vue": "^5.1.10",
-    "@zxcvbn-ts/core": "^3.0.3",
+    "@zxcvbn-ts/core": "^3.0.4",
     "animate.css": "^4.1.1",
     "axios": "^1.5.0",
     "benz-amr-recorder": "^1.1.5",
     "bpmn-js-token-simulation": "^0.10.0",
     "camunda-bpmn-moddle": "^7.0.1",
-    "cropperjs": "^1.6.0",
+    "cropperjs": "^1.6.1",
     "crypto-js": "^4.1.1",
-    "dayjs": "^1.11.9",
+    "dayjs": "^1.11.10",
     "diagram-js": "^12.3.0",
     "echarts": "^5.4.3",
     "echarts-wordcloud": "^2.1.0",
-    "element-plus": "2.3.12",
+    "element-plus": "2.3.14",
-    "fast-xml-parser": "^4.2.7",
+    "fast-xml-parser": "^4.3.0",
     "highlight.js": "^11.8.0",
     "intro.js": "^7.2.0",
     "jsencrypt": "^3.3.2",
@@ -59,12 +59,12 @@
     "qrcode": "^1.5.3",
     "qs": "^6.11.2",
     "steady-xml": "^0.1.0",
-    "url": "^0.11.2",
+    "url": "^0.11.3",
     "video.js": "^7.21.5",
-    "vue": "3.3.4",
+    "vue": "^3.3.4",
     "vue-dompurify-html": "^4.1.4",
-    "vue-i18n": "9.2.2",
+    "vue-i18n": "^9.4.1",
-    "vue-router": "^4.2.4",
+    "vue-router": "^4.2.5",
     "vue-types": "^5.1.1",
     "vuedraggable": "^4.1.0",
     "vxe-table": "^4.3.11",
@@ -75,8 +75,8 @@
   "devDependencies": {
     "@commitlint/cli": "^17.7.1",
     "@commitlint/config-conventional": "^17.7.0",
-    "@iconify/json": "^2.2.114",
+    "@iconify/json": "^2.2.119",
-    "@intlify/unplugin-vue-i18n": "^1.0.1",
+    "@intlify/unplugin-vue-i18n": "^1.2.0",
     "@purge-icons/generated": "^0.9.0",
     "@types/intro.js": "^5.1.1",
     "@types/lodash-es": "^4.17.9",
@@ -84,16 +84,17 @@
     "@types/nprogress": "^0.2.0",
     "@types/qrcode": "^1.5.2",
     "@types/qs": "^6.9.8",
-    "@typescript-eslint/eslint-plugin": "^6.6.0",
+    "@typescript-eslint/eslint-plugin": "^6.7.2",
-    "@typescript-eslint/parser": "^6.6.0",
+    "@typescript-eslint/parser": "^6.7.2",
-    "@unocss/transformer-variant-group": "^0.55.7",
+    "@unocss/transformer-variant-group": "^0.56.1",
+    "@unocss/eslint-config": "^0.56.1",
     "@vitejs/plugin-legacy": "^4.1.1",
     "@vitejs/plugin-vue": "^4.3.4",
     "@vitejs/plugin-vue-jsx": "^3.0.2",
     "@vue-macros/volar": "^0.14.3",
-    "autoprefixer": "^10.4.15",
+    "autoprefixer": "^10.4.16",
-    "bpmn-js": "^8.9.0",
+    "bpmn-js": "8.9.0",
-    "bpmn-js-properties-panel": "^0.46.0",
+    "bpmn-js-properties-panel": "0.46.0",
     "consola": "^3.2.3",
     "eslint": "^8.49.0",
     "eslint-config-prettier": "^9.0.0",
@@ -101,21 +102,21 @@
     "eslint-plugin-prettier": "^5.0.0",
     "eslint-plugin-vue": "^9.17.0",
     "lint-staged": "^14.0.1",
-    "postcss": "^8.4.29",
+    "postcss": "^8.4.30",
     "postcss-html": "^1.5.0",
     "postcss-scss": "^4.0.8",
     "prettier": "^3.0.3",
     "rimraf": "^5.0.1",
-    "rollup": "^3.29.1",
+    "rollup": "^3.29.2",
-    "sass": "^1.66.1",
+    "sass": "^1.68.0",
     "stylelint": "^15.10.3",
     "stylelint-config-html": "^1.1.0",
     "stylelint-config-recommended": "^13.0.0",
     "stylelint-config-standard": "^34.0.0",
     "stylelint-order": "^6.0.3",
-    "terser": "^5.19.4",
+    "terser": "^5.20.0",
-    "typescript": "5.1.6",
+    "typescript": "5.2.2",
-    "unocss": "^0.55.7",
+    "unocss": "^0.56.1",
     "unplugin-auto-import": "^0.16.6",
     "unplugin-element-plus": "^0.8.0",
     "unplugin-vue-components": "^0.25.2",
@@ -128,7 +129,7 @@
     "vite-plugin-svg-icons": "^2.0.1",
     "vite-plugin-top-level-await": "^1.3.1",
     "vue-eslint-parser": "^9.3.1",
-    "vue-tsc": "^1.8.10"
+    "vue-tsc": "^1.8.13"
   },
   "license": "MIT",
   "repository": {

src/api/bpm/task/index.ts

@@ -41,3 +41,13 @@ export const getTaskListByProcessInstanceId = async (processInstanceId) => {
 export const exportTask = async (params) => {
   return await request.download({ url: '/bpm/task/export', params })
 }
+
+// 获取所有可回退的节点
+export const getReturnList = async (params) => {
+  return await request.get({ url: '/bpm/task/get-return-list', params })
+}
+
+// 回退
+export const returnTask = async (data) => {
+  return await request.put({ url: '/bpm/task/return', data })
+}

src/api/mall/product/spu.ts

@@ -20,8 +20,8 @@ export interface Sku {
   stock?: number // 库存
   weight?: number // 商品重量，单位：kg 千克
   volume?: number // 商品体积，单位：m^3 平米
-  subCommissionFirstPrice?: number | string // 一级分销的佣金
+  firstBrokerageRecord?: number | string // 一级分销的佣金
-  subCommissionSecondPrice?: number | string // 二级分销的佣金
+  secondBrokerageRecord?: number | string // 二级分销的佣金
   salesCount?: number // 商品销量
 }
 

src/api/mall/trade/brokerage/record/index.ts

@@ -0,0 +1,11 @@
+import request from '@/config/axios'
+
+// 查询佣金记录列表
+export const getBrokerageRecordPage = async (params: any) => {
+  return await request.get({ url: `/trade/brokerage-record/page`, params })
+}
+
+// 查询佣金记录详情
+export const getBrokerageRecord = async (id: number) => {
+  return await request.get({ url: `/trade/brokerage-record/get?id=` + id })
+}

src/api/mall/trade/brokerage/user/index.ts

@@ -0,0 +1,39 @@
+import request from '@/config/axios'
+
+export interface BrokerageUserVO {
+  id: number
+  bindUserId: number
+  bindUserTime: Date
+  brokerageEnabled: boolean
+  brokerageTime: Date
+  price: number
+  frozenPrice: number
+
+  nickname: string
+  avatar: string
+}
+
+// 查询分销用户列表
+export const getBrokerageUserPage = async (params: any) => {
+  return await request.get({ url: `/trade/brokerage-user/page`, params })
+}
+
+// 查询分销用户详情
+export const getBrokerageUser = async (id: number) => {
+  return await request.get({ url: `/trade/brokerage-user/get?id=` + id })
+}
+
+// 修改推广员
+export const updateBindUser = async (data: any) => {
+  return await request.put({ url: `/trade/brokerage-user/update-bind-user`, data })
+}
+
+// 清除推广员
+export const clearBindUser = async (data: any) => {
+  return await request.put({ url: `/trade/brokerage-user/clear-bind-user`, data })
+}
+
+// 修改推广资格
+export const updateBrokerageEnabled = async (data: any) => {
+  return await request.put({ url: `/trade/brokerage-user/update-brokerage-enable`, data })
+}

src/api/mall/trade/brokerage/withdraw/index.ts

@@ -0,0 +1,39 @@
+import request from '@/config/axios'
+
+export interface BrokerageWithdrawVO {
+  id: number
+  userId: number
+  price: number
+  feePrice: number
+  totalPrice: number
+  type: number
+  name: string
+  accountNo: string
+  bankName: string
+  bankAddress: string
+  accountQrCodeUrl: string
+  status: number
+  auditReason: string
+  auditTime: Date
+  remark: string
+}
+
+// 查询佣金提现列表
+export const getBrokerageWithdrawPage = async (params: any) => {
+  return await request.get({ url: `/trade/brokerage-withdraw/page`, params })
+}
+
+// 查询佣金提现详情
+export const getBrokerageWithdraw = async (id: number) => {
+  return await request.get({ url: `/trade/brokerage-withdraw/get?id=` + id })
+}
+
+// 佣金提现 - 通过申请
+export const approveBrokerageWithdraw = async (id: number) => {
+  return await request.put({ url: `/trade/brokerage-withdraw/approve?id=` + id })
+}
+
+// 审核佣金提现 - 驳回申请
+export const rejectBrokerageWithdraw = async (data: BrokerageWithdrawVO) => {
+  return await request.put({ url: `/trade/brokerage-withdraw/reject`, data })
+}

src/api/mall/trade/config/index.ts

@@ -0,0 +1,24 @@
+import request from '@/config/axios'
+
+export interface ConfigVO {
+  brokerageEnabled: boolean
+  brokerageEnabledCondition: number
+  brokerageBindMode: number
+  brokeragePostUrls: string
+  brokerageFirstPercent: number
+  brokerageSecondPercent: number
+  brokerageWithdrawMinPrice: number
+  brokerageBankNames: string
+  brokerageFrozenDays: number
+  brokerageWithdrawType: string
+}
+
+// 查询交易中心配置详情
+export const getTradeConfig = async () => {
+  return await request.get({ url: `/trade/config/get` })
+}
+
+// 保存交易中心配置
+export const saveTradeConfig = async (data: ConfigVO) => {
+  return await request.put({ url: `/trade/config/save`, data })
+}

src/api/mall/trade/order/index.ts

@@ -51,12 +51,13 @@ export interface OrderVO {
     avatar?: string
   }
   // 订单操作日志
-  orderLog: orderLog[]
+  logs?: OrderLogRespVO[]
 }
 
-export interface orderLog {
+export interface OrderLogRespVO {
   content?: string
   createTime?: Date
+  userType?: number
 }
 
 export interface OrderItemRespVO {

src/api/member/experience-record/index.ts

@@ -0,0 +1,22 @@
+import request from '@/config/axios'
+
+export interface ExperienceRecordVO {
+  id: number
+  userId: number
+  bizId: string
+  bizType: number
+  title: string
+  description: string
+  experience: number
+  totalExperience: number
+}
+
+// 查询会员经验记录列表
+export const getExperienceRecordPage = async (params) => {
+  return await request.get({ url: `/member/experience-record/page`, params })
+}
+
+// 查询会员经验记录详情
+export const getExperienceRecord = async (id: number) => {
+  return await request.get({ url: `/member/experience-record/get?id=` + id })
+}

src/components/Dialog/src/Dialog.vue

@@ -72,23 +72,23 @@ const dialogStyle = computed(() => {
     :show-close="false"
   >
     <template #header="{ close }">
-      <div class="flex justify-between items-center h-54px pl-15px pr-15px relative">
+      <div class="relative h-54px flex items-center justify-between pl-15px pr-15px">
         <slot name="title">
           {{ title }}
         </slot>
         <div
-          class="h-54px flex justify-between items-center absolute top-[50%] right-15px translate-y-[-50%]"
+          class="absolute right-15px top-[50%] h-54px flex translate-y-[-50%] items-center justify-between"
         >
           <Icon
             v-if="fullscreen"
-            class="cursor-pointer is-hover mr-10px"
+            class="is-hover mr-10px cursor-pointer"
             :icon="isFullscreen ? 'radix-icons:exit-full-screen' : 'radix-icons:enter-full-screen'"
             color="var(--el-color-info)"
             hover-color="var(--el-color-primary)"
             @click="toggleFull"
           />
           <Icon
-            class="cursor-pointer is-hover"
+            class="is-hover cursor-pointer"
             icon="ep:close"
             hover-color="var(--el-color-primary)"
             color="var(--el-color-info)"

src/components/Editor/src/Editor.vue

@@ -180,12 +180,12 @@ defineExpose({
 </script>
 
 <template>
-  <div class="border-1 border-solid border-[var(--el-border-color)] z-99">
+  <div class="z-99 border-1 border-[var(--el-border-color)] border-solid">
     <!-- 工具栏 -->
     <Toolbar
       :editor="editorRef"
       :editorId="editorId"
-      class="border-0 b-b-1 border-solid border-[var(--el-border-color)]"
+      class="border-0 b-b-1 border-[var(--el-border-color)] border-solid"
     />
     <!-- 编辑器 -->
     <Editor

src/components/Form/src/Form.vue

@@ -203,7 +203,7 @@ export default defineComponent({
                       icon="ep:warning"
                       size={16}
                       color="var(--el-color-primary)"
-                      class="ml-2px relative top-1px"
+                      class="relative top-1px ml-2px"
                     ></Icon>
                   )
                 }}

src/components/Icon/src/IconSelect.vue

@@ -128,7 +128,7 @@ watch(
         >
           <template #reference>
             <div
-              class="w-40px h-32px cursor-pointer flex justify-center items-center"
+              class="h-32px w-40px flex cursor-pointer items-center justify-center"
               @click="visible = !visible"
             >
               <Icon :icon="currentActiveType + icon" />
@@ -147,13 +147,13 @@ watch(
             >
               <ElDivider border-style="dashed" class="tab-divider" />
               <ElScrollbar height="220px">
-                <ul class="flex flex-wrap px-2 ml-2">
+                <ul class="ml-2 flex flex-wrap px-2">
                   <li
                     v-for="(item, key) in pageList"
                     :key="key"
                     :style="iconItemStyle(item)"
                     :title="item"
-                    class="icon-item p-2 w-1/10 cursor-pointer mr-2 mt-1 flex justify-center items-center border border-solid"
+                    class="icon-item mr-2 mt-1 w-1/10 flex cursor-pointer items-center justify-center border border-solid p-2"
                     @click="onChangeIcon(item)"
                   >
                     <Icon :icon="currentActiveType + item" />
@@ -169,7 +169,7 @@ watch(
             :page-size="pageSize"
             :total="iconCount"
             background
-            class="flex items-center justify-center h-10"
+            class="h-10 flex items-center justify-center"
             layout="prev, pager, next"
             small
             @current-change="onCurrentChange"

src/components/Infotip/src/Infotip.vue

@@ -40,7 +40,7 @@ const keyClick = (key: string) => {
       <span :class="[`${prefixCls}__title`, 'pl-5px text-16px font-bold']">{{ title }}</span>
     </div>
     <div :class="`${prefixCls}__content`">
-      <p v-for="(item, $index) in schema" :key="$index" class="text-14px mt-15px">
+      <p v-for="(item, $index) in schema" :key="$index" class="mt-15px text-14px">
         <Highlight
           :color="highlightColor"
           :keys="typeof item === 'string' ? [] : item.keys"

src/components/InputPassword/src/InputPassword.vue

@@ -67,7 +67,7 @@ const getIconName = computed(() => (unref(textType) === 'password' ? 'ep:hide' :
     <div
       v-if="strength"
       :class="`${prefixCls}__bar`"
-      class="relative h-6px mt-10px mb-6px mr-auto ml-auto"
+      class="relative mb-6px ml-auto mr-auto mt-10px h-6px"
     >
       <div :class="`${prefixCls}__bar--fill`" :data-score="getPasswordStrength"></div>
     </div>

src/components/Pagination/index.vue

@@ -9,7 +9,7 @@
     :pager-count="pagerCount"
     :total="total"
     :small="isSmall"
-    class="float-right mt-15px mb-15px"
+    class="float-right mb-15px mt-15px"
     layout="total, sizes, prev, pager, next, jumper"
     @size-change="handleSizeChange"
     @current-change="handleCurrentChange"

src/components/Qrcode/src/Qrcode.vue

@@ -227,10 +227,10 @@ const disabledClick = () => {
     <div
       v-if="disabled"
       :class="`${prefixCls}--disabled`"
-      class="absolute top-0 left-0 flex w-full h-full items-center justify-center"
+      class="absolute left-0 top-0 h-full w-full flex items-center justify-center"
       @click="disabledClick"
     >
-      <div class="absolute top-[50%] left-[50%] font-bold">
+      <div class="absolute left-[50%] top-[50%] font-bold">
         <Icon :size="30" color="var(--el-color-primary)" icon="ep:refresh-right" />
         <div>{{ disabledText }}</div>
       </div>

src/components/Table/src/Table.vue

@@ -289,7 +289,7 @@ export default defineComponent({
           <ElPagination
             v-model:pageSize={pageSizeRef.value}
             v-model:currentPage={currentPageRef.value}
-            class="float-right mt-15px mb-15px"
+            class="float-right mb-15px mt-15px"
             {...unref(pagination)}
           ></ElPagination>
         ) : undefined}

src/components/Tooltip/src/Tooltip.vue

@@ -12,6 +12,6 @@ defineProps({
 <template>
   <span>{{ titel }}</span>
   <ElTooltip :content="message" placement="top">
-    <Icon :icon="icon" class="ml-1px relative top-1px" />
+    <Icon :icon="icon" class="relative top-1px ml-1px" />
   </ElTooltip>
 </template>

src/components/bpmnProcessDesigner/package/designer/ProcessViewer.vue

@@ -11,6 +11,7 @@ import BpmnViewer from 'bpmn-js/lib/Viewer'
 import DefaultEmptyXML from './plugins/defaultEmpty'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { formatDate } from '@/utils/formatTime'
+import { isEmpty } from '@/utils/is'
 
 defineOptions({ name: 'MyProcessViewer' })
 
@@ -85,6 +86,7 @@ const createNewDiagram = async (xml) => {
     // console.error(`[Process Designer Warn]: ${e?.message || e}`);
   }
 }
+
 /* 高亮流程图 */
 // TODO 芋艿：如果多个 endActivity 的话，目前的逻辑可能有一定的问题。https://www.jdon.com/workflow/multi-events.html
 const highlightDiagram = async () => {
@@ -97,6 +99,9 @@ const highlightDiagram = async () => {
   let canvas = bpmnModeler.get('canvas')
   let todoActivity: any = activityList.find((m: any) => !m.endTime) // 找到待办的任务
   let endActivity: any = activityList[activityList.length - 1] // 获得最后一个任务
+  let findProcessTask = false //是否已经高亮了进行中的任务
+  //进行中高亮之后的任务 key 集合，用于过滤掉 taskList 进行中后面的任务，避免进行中后面的数据 Hover 还有数据
+  let removeTaskDefinitionKeyList = []
   // debugger
   bpmnModeler.getDefinitions().rootElements[0].flowElements?.forEach((n: any) => {
     let activity: any = activityList.find((m: any) => m.key === n.id) // 找到对应的活动
@@ -110,9 +115,17 @@ const highlightDiagram = async () => {
       if (!task) {
         return
       }
+      //进行中的任务已经高亮过了，则不高亮后面的任务了
+      if (findProcessTask) {
+        removeTaskDefinitionKeyList.push(n.id)
+        return
+      }
       // 高亮任务
       canvas.addMarker(n.id, getResultCss(task.result))
-
+      //标记是否高亮了进行中任务
+      if (task.result === 1) {
+        findProcessTask = true
+      }
       // 如果非通过，就不走后面的线条了
       if (task.result !== 2) {
         return
@@ -212,6 +225,11 @@ const highlightDiagram = async () => {
       }
     }
   })
+  if (!isEmpty(removeTaskDefinitionKeyList)) {
+    taskList.value = taskList.value.filter(
+      (item) => !removeTaskDefinitionKeyList.includes(item.definitionKey)
+    )
+  }
 }
 const getActivityHighlightCss = (activity) => {
   return activity.endTime ? 'highlight' : 'highlight-todo'
@@ -229,6 +247,9 @@ const getResultCss = (result) => {
   } else if (result === 4) {
     // 已取消
     return 'highlight-cancel'
+  } else if (result === 5) {
+    // 退回
+    return 'highlight-return'
   }
   return ''
 }
@@ -273,9 +294,9 @@ const elementHover = (element) => {
   console.log(element.value, 'element.value')
   const activity = activityLists.value.find((m) => m.key === element.value.id)
   console.log(activity, 'activityactivityactivityactivity')
-  // if (!activity) {
+  if (!activity) {
-  //   return
+    return
-  // }
+  }
   if (!elementOverlayIds.value[element.value.id] && element.value.type !== 'bpmn:Process') {
     let html = `<div class="element-overlays">
             <p>Elemet id: ${element.value.id}</p>
@@ -564,6 +585,45 @@ watch(
   stroke: grey !important;
 }
 
+/** 回退 */
+.highlight-return.djs-shape .djs-visual > :nth-child(1) {
+  fill: #e6a23c !important;
+  stroke: #e6a23c !important;
+  fill-opacity: 0.2 !important;
+}
+.highlight-return.djs-shape .djs-visual > :nth-child(2) {
+  fill: #e6a23c !important;
+}
+.highlight-return.djs-shape .djs-visual > path {
+  fill: #e6a23c !important;
+  fill-opacity: 0.2 !important;
+  stroke: #e6a23c !important;
+}
+.highlight-return.djs-connection > .djs-visual > path {
+  stroke: #e6a23c !important;
+}
+
+.highlight-return:not(.djs-connection) .djs-visual > :nth-child(1) {
+  fill: #e6a23c !important; /* color elements as green */
+}
+
+:deep(.highlight-return.djs-shape .djs-visual > :nth-child(1)) {
+  fill: #e6a23c !important;
+  stroke: #e6a23c !important;
+  fill-opacity: 0.2 !important;
+}
+:deep(.highlight-return.djs-shape .djs-visual > :nth-child(2)) {
+  fill: #e6a23c !important;
+}
+:deep(.highlight-return.djs-shape .djs-visual > path) {
+  fill: #e6a23c !important;
+  fill-opacity: 0.2 !important;
+  stroke: #e6a23c !important;
+}
+:deep(.highlight-return.djs-connection > .djs-visual > path) {
+  stroke: #e6a23c !important;
+}
+
 .element-overlays {
   width: 200px;
   padding: 8px;

src/components/bpmnProcessDesigner/package/penal/form/ElementForm.vue

@@ -15,7 +15,7 @@
     <!--字段列表-->
     <div class="element-property list-property">
       <el-divider><Icon icon="ep:coin" /> 表单字段</el-divider>
-      <el-table :data="fieldList" max-height="240" border fit>
+      <el-table :data="fieldList" max-height="240" fit border>
         <el-table-column label="序号" type="index" width="50px" />
         <el-table-column label="字段名称" prop="label" min-width="80px" show-overflow-tooltip />
         <el-table-column
@@ -97,7 +97,7 @@
             >添加枚举值</el-button
           >
         </p>
-        <el-table :data="fieldEnumList" key="enum-table" max-height="240" border fit>
+        <el-table :data="fieldEnumList" key="enum-table" max-height="240" fit border>
           <el-table-column label="序号" width="50px" type="index" />
           <el-table-column label="枚举值编号" prop="id" min-width="100px" show-overflow-tooltip />
           <el-table-column label="枚举值名称" prop="name" min-width="100px" show-overflow-tooltip />
@@ -130,7 +130,7 @@
           >添加约束</el-button
         >
       </p>
-      <el-table :data="fieldConstraintsList" key="validation-table" max-height="240" border fit>
+      <el-table :data="fieldConstraintsList" key="validation-table" max-height="240" fit border>
         <el-table-column label="序号" width="50px" type="index" />
         <el-table-column label="约束名称" prop="name" min-width="100px" show-overflow-tooltip />
         <el-table-column label="约束配置" prop="config" min-width="100px" show-overflow-tooltip />
@@ -162,7 +162,7 @@
           >添加属性</el-button
         >
       </p>
-      <el-table :data="fieldPropertiesList" key="property-table" max-height="240" border fit>
+      <el-table :data="fieldPropertiesList" key="property-table" max-height="240" fit border>
         <el-table-column label="序号" width="50px" type="index" />
         <el-table-column label="属性编号" prop="id" min-width="100px" show-overflow-tooltip />
         <el-table-column label="属性值" prop="value" min-width="100px" show-overflow-tooltip />

src/components/bpmnProcessDesigner/package/penal/listeners/ElementListeners.vue

@@ -139,8 +139,8 @@
         :data="fieldsListOfListener"
         size="small"
         max-height="240"
-        border
         fit
+        border
         style="flex: none"
       >
         <el-table-column label="序号" width="50px" type="index" />

src/components/bpmnProcessDesigner/package/penal/listeners/UserTaskListeners.vue

@@ -184,8 +184,8 @@
         :data="fieldsListOfListener"
         size="small"
         max-height="240"
-        border
         fit
+        border
         style="flex: none"
       >
         <el-table-column label="序号" width="50px" type="index" />

src/components/bpmnProcessDesigner/package/penal/properties/ElementProperties.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="panel-tab__content">
-    <el-table :data="elementPropertyList" max-height="240" border fit>
+    <el-table :data="elementPropertyList" max-height="240" fit border>
       <el-table-column label="序号" width="50px" type="index" />
       <el-table-column label="属性名" prop="name" min-width="100px" show-overflow-tooltip />
       <el-table-column label="属性值" prop="value" min-width="100px" show-overflow-tooltip />

src/layout/Layout.vue

@@ -50,7 +50,7 @@ export default defineComponent({
       <section class={[prefixCls, `${prefixCls}__${layout.value}`, 'w-[100%] h-[100%] relative']}>
         {mobile.value && !collapse.value ? (
           <div
-            class="absolute top-0 left-0 w-full h-full opacity-30 z-99 bg-[var(--el-color-black)]"
+            class="absolute left-0 top-0 z-99 h-full w-full bg-[var(--el-color-black)] opacity-30"
             onClick={handleClickOutside}
           ></div>
         ) : undefined}

src/layout/components/Footer/src/Footer.vue

@@ -17,7 +17,7 @@ const title = computed(() => appStore.getTitle)
 <template>
   <div
     :class="prefixCls"
-    class="text-center text-[var(--el-text-color-placeholder)] bg-[var(--app-content-bg-color)] h-[var(--app-footer-height)] leading-[var(--app-footer-height)] dark:bg-[var(--el-bg-color)]"
+    class="h-[var(--app-footer-height)] bg-[var(--app-content-bg-color)] text-center leading-[var(--app-footer-height)] text-[var(--el-text-color-placeholder)] dark:bg-[var(--el-bg-color)]"
   >
     <p style="font-size: 14px">Copyright ©2022-{{ title }}</p>
   </div>

src/layout/components/Logo/src/Logo.vue

@@ -67,7 +67,7 @@ watch(
       to="/"
     >
       <img
-        class="w-[calc(var(--logo-height)-10px)] h-[calc(var(--logo-height)-10px)]"
+        class="h-[calc(var(--logo-height)-10px)] w-[calc(var(--logo-height)-10px)]"
         src="@/assets/imgs/logo.png"
       />
       <div

src/layout/components/Setting/src/Setting.vue

@@ -200,7 +200,7 @@ const clear = () => {
 <template>
   <div
     :class="prefixCls"
-    class="fixed top-[45%] right-0 w-40px h-40px text-center leading-40px bg-[var(--el-color-primary)] cursor-pointer"
+    class="fixed right-0 top-[45%] h-40px w-40px cursor-pointer bg-[var(--el-color-primary)] text-center leading-40px"
     @click="drawer = true"
   >
     <Icon color="#fff" icon="ep:setting" />

src/layout/components/Setting/src/components/ColorRadioPicker.vue

@@ -48,7 +48,7 @@ watch(
       :style="{
         background: item
       }"
-      class="w-20px h-20px cursor-pointer rounded-2px border-solid border-gray-300 border-2px text-center leading-20px mb-5px"
+      class="mb-5px h-20px w-20px cursor-pointer border-2px border-gray-300 rounded-2px border-solid text-center leading-20px"
       @click="colorVal = item"
     >
       <Icon v-if="colorVal === item" :size="16" color="#fff" icon="ep:check" />

src/layout/components/Setting/src/components/InterfaceDisplay.vue

@@ -141,84 +141,84 @@ watch(
 
 <template>
   <div :class="prefixCls">
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.breadcrumb') }}</span>
       <ElSwitch v-model="breadcrumb" @change="breadcrumbChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.breadcrumbIcon') }}</span>
       <ElSwitch v-model="breadcrumbIcon" @change="breadcrumbIconChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.hamburgerIcon') }}</span>
       <ElSwitch v-model="hamburger" @change="hamburgerChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.screenfullIcon') }}</span>
       <ElSwitch v-model="screenfull" @change="screenfullChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.sizeIcon') }}</span>
       <ElSwitch v-model="size" @change="sizeChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.localeIcon') }}</span>
       <ElSwitch v-model="locale" @change="localeChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.messageIcon') }}</span>
       <ElSwitch v-model="message" @change="messageChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.tagsView') }}</span>
       <ElSwitch v-model="tagsView" @change="tagsViewChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.tagsViewIcon') }}</span>
       <ElSwitch v-model="tagsViewIcon" @change="tagsViewIconChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.logo') }}</span>
       <ElSwitch v-model="logo" @change="logoChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.uniqueOpened') }}</span>
       <ElSwitch v-model="uniqueOpened" @change="uniqueOpenedChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.fixedHeader') }}</span>
       <ElSwitch v-model="fixedHeader" @change="fixedHeaderChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.footer') }}</span>
       <ElSwitch v-model="footer" @change="footerChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.greyMode') }}</span>
       <ElSwitch v-model="greyMode" @change="greyModeChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('setting.fixedMenu') }}</span>
       <ElSwitch v-model="fixedMenu" @change="fixedMenuChange" />
     </div>
 
-    <div class="flex justify-between items-center">
+    <div class="flex items-center justify-between">
       <span class="text-14px">{{ t('watermark.watermark') }}</span>
-      <ElInput v-model="water" class="w-20 right-1" @change="setWater()" />
+      <ElInput v-model="water" class="right-1 w-20" @change="setWater()" />
     </div>
   </div>
 </template>

src/layout/components/Setting/src/components/LayoutRadioPicker.vue

@@ -55,7 +55,7 @@ const layout = computed(() => appStore.getLayout)
       ]"
       @click="appStore.setLayout('cutMenu')"
     >
-      <div class="absolute h-full w-[33%] top-0 left-[10%] bg-gray-200"></div>
+      <div class="absolute left-[10%] top-0 h-full w-[33%] bg-gray-200"></div>
     </div>
   </div>
 </template>

src/layout/components/TabMenu/src/TabMenu.vue

@@ -176,7 +176,7 @@ export default defineComponent({
                       <Icon icon={item?.meta?.icon}></Icon>
                     </div>
                     {!unref(showTitle) ? undefined : (
-                      <p class="break-words mt-5px px-2px">{t(item.meta?.title)}</p>
+                      <p class="mt-5px break-words px-2px">{t(item.meta?.title)}</p>
                     )}
                   </div>
                 )

src/layout/components/TagsView/src/TagsView.vue

@@ -263,11 +263,11 @@ watch(
   <div
     :id="prefixCls"
     :class="prefixCls"
-    class="flex w-full relative bg-[#fff] dark:bg-[var(--el-bg-color)]"
+    class="relative w-full flex bg-[#fff] dark:bg-[var(--el-bg-color)]"
   >
     <span
       :class="`${prefixCls}__tool ${prefixCls}__tool--first`"
-      class="w-[var(--tags-view-height)] h-[var(--tags-view-height)] flex items-center justify-center cursor-pointer"
+      class="h-[var(--tags-view-height)] w-[var(--tags-view-height)] flex cursor-pointer items-center justify-center"
       @click="move(-200)"
     >
       <Icon
@@ -276,9 +276,9 @@ watch(
         :hover-color="isDark ? '#fff' : 'var(--el-color-black)'"
       />
     </span>
-    <div class="overflow-hidden flex-1">
+    <div class="flex-1 overflow-hidden">
       <ElScrollbar ref="scrollbarRef" class="h-full" @scroll="scroll">
-        <div class="flex h-full">
+        <div class="h-full flex">
           <ContextMenu
             :ref="itemRefs.set"
             :schema="[
@@ -354,7 +354,7 @@ watch(
               <router-link :ref="tagLinksRefs.set" :to="{ ...item }" custom v-slot="{ navigate }">
                 <div
                   @click="navigate"
-                  class="h-full flex justify-center items-center whitespace-nowrap pl-15px"
+                  class="h-full flex items-center justify-center whitespace-nowrap pl-15px"
                 >
                   <Icon
                     v-if="
@@ -384,7 +384,7 @@ watch(
     </div>
     <span
       :class="`${prefixCls}__tool`"
-      class="w-[var(--tags-view-height)] h-[var(--tags-view-height)] flex items-center justify-center cursor-pointer"
+      class="h-[var(--tags-view-height)] w-[var(--tags-view-height)] flex cursor-pointer items-center justify-center"
       @click="move(200)"
     >
       <Icon
@@ -395,7 +395,7 @@ watch(
     </span>
     <span
       :class="`${prefixCls}__tool`"
-      class="w-[var(--tags-view-height)] h-[var(--tags-view-height)] flex items-center justify-center cursor-pointer"
+      class="h-[var(--tags-view-height)] w-[var(--tags-view-height)] flex cursor-pointer items-center justify-center"
       @click="refreshSelectedTag(selectedTag)"
     >
       <Icon
@@ -460,7 +460,7 @@ watch(
     >
       <span
         :class="`${prefixCls}__tool`"
-        class="w-[var(--tags-view-height)] h-[var(--tags-view-height)] flex items-center justify-center cursor-pointer block"
+        class="block h-[var(--tags-view-height)] w-[var(--tags-view-height)] flex cursor-pointer items-center justify-center"
       >
         <Icon
           icon="ep:menu"

src/layout/components/UserInfo/src/UserInfo.vue

@@ -54,7 +54,7 @@ const toDocument = () => {
   <ElDropdown class="custom-hover" :class="prefixCls" trigger="click">
     <div class="flex items-center">
       <ElAvatar :src="avatar" alt="" class="w-[calc(var(--logo-height)-25px)] rounded-[50%]" />
-      <span class="<lg:hidden text-14px pl-[5px] text-[var(--top-header-text-color)]">
+      <span class="pl-[5px] text-14px text-[var(--top-header-text-color)] <lg:hidden">
         {{ userName }}
       </span>
     </div>

src/utils/constants.ts

@@ -272,3 +272,89 @@ export const PromotionDiscountTypeEnum = {
     name: '折扣'
   }
 }
+
+/**
+ * 分销关系绑定模式枚举
+ */
+export const BrokerageBindModeEnum = {
+  ANYTIME: {
+    mode: 0,
+    name: '没有推广人'
+  },
+  REGISTER: {
+    mode: 1,
+    name: '新用户'
+  }
+}
+/**
+ * 分佣模式枚举
+ */
+export const BrokerageEnabledConditionEnum = {
+  ALL: {
+    condition: 0,
+    name: '人人分销'
+  },
+  ADMIN: {
+    condition: 1,
+    name: '指定分销'
+  }
+}
+/**
+ * 佣金记录业务类型枚举
+ */
+export const BrokerageRecordBizTypeEnum = {
+  ORDER: {
+    type: 1,
+    name: '获得推广佣金'
+  },
+  WITHDRAW: {
+    type: 2,
+    name: '提现申请'
+  }
+}
+/**
+ * 佣金提现状态枚举
+ */
+export const BrokerageWithdrawStatusEnum = {
+  AUDITING: {
+    status: 0,
+    name: '审核中'
+  },
+  AUDIT_SUCCESS: {
+    status: 10,
+    name: '审核通过'
+  },
+  AUDIT_FAIL: {
+    status: 20,
+    name: '审核不通过'
+  },
+  WITHDRAW_SUCCESS: {
+    status: 11,
+    name: '提现成功'
+  },
+  WITHDRAW_FAIL: {
+    status: 21,
+    name: '提现失败'
+  }
+}
+/**
+ * 佣金提现类型枚举
+ */
+export const BrokerageWithdrawTypeEnum = {
+  WALLET: {
+    type: 1,
+    name: '钱包'
+  },
+  BANK: {
+    type: 2,
+    name: '银行卡'
+  },
+  WECHAT: {
+    type: 3,
+    name: '微信'
+  },
+  ALIPAY: {
+    type: 4,
+    name: '支付宝'
+  }
+}

src/utils/dict.ts

@@ -60,13 +60,19 @@ export const getBoolDictOptions = (dictType: string) => {
   return dictOption
 }
 
-export const getDictObj = (dictType: string, value: any) => {
+/**
+ * 获取指定字典类型的指定值对应的字典对象
+ * @param dictType 字典类型
+ * @param value 字典值
+ * @return DictDataType 字典对象
+ */
+export const getDictObj = (dictType: string, value: any): DictDataType | undefined => {
   const dictOptions: DictDataType[] = getDictOptions(dictType)
-  dictOptions.forEach((dict: DictDataType) => {
+  for (const dict of dictOptions) {
-    if (dict.value === value.toString()) {
+    if (dict.value === value + '') {
       return dict
     }
-  })
+  }
 }
 
 /**
@@ -74,12 +80,13 @@ export const getDictObj = (dictType: string, value: any) => {
  *
  * @param dictType 字典类型
  * @param value 字典数据的值
+ * @return 字典名称
  */
-export const getDictLabel = (dictType: string, value: any) => {
+export const getDictLabel = (dictType: string, value: any): string => {
   const dictOptions: DictDataType[] = getDictOptions(dictType)
   const dictLabel = ref('')
   dictOptions.forEach((dict: DictDataType) => {
-    if (dict.value === value) {
+    if (dict.value === value + '') {
       dictLabel.value = dict.label
     }
   })
@@ -132,7 +139,7 @@ export enum DICT_TYPE {
   BPM_OA_LEAVE_TYPE = 'bpm_oa_leave_type',
 
   // ========== PAY 模块 ==========
-  PAY_CHANNEL_CODE = 'pay_channel_code_type', // 支付渠道编码类型
+  PAY_CHANNEL_CODE = 'pay_channel_code', // 支付渠道编码类型
   PAY_ORDER_STATUS = 'pay_order_status', // 商户支付订单状态
   PAY_REFUND_STATUS = 'pay_refund_status', // 退款订单状态
   PAY_NOTIFY_STATUS = 'pay_notify_status', // 商户支付回调状态
@@ -144,6 +151,7 @@ export enum DICT_TYPE {
 
   // ========== MALL - 会员模块 ==========
   MEMBER_POINT_BIZ_TYPE = 'member_point_biz_type', // 积分的业务类型
+  MEMBER_EXPERIENCE_BIZ_TYPE = 'member_experience_biz_type', // 会员经验业务类型
 
   // ========== MALL - 商品模块 ==========
   PRODUCT_UNIT = 'product_unit', // 商品单位
@@ -158,6 +166,13 @@ export enum DICT_TYPE {
   TRADE_ORDER_STATUS = 'trade_order_status', // 订单 - 状态
   TRADE_ORDER_ITEM_AFTER_SALE_STATUS = 'trade_order_item_after_sale_status', // 订单项 - 售后状态
   TRADE_DELIVERY_TYPE = 'trade_delivery_type', // 配送方式
+  BROKERAGE_ENABLED_CONDITION = 'brokerage_enabled_condition', // 分佣模式
+  BROKERAGE_BIND_MODE = 'brokerage_bind_mode', // 分销关系绑定模式
+  BROKERAGE_BANK_NAME = 'brokerage_bank_name', // 佣金提现银行
+  BROKERAGE_WITHDRAW_TYPE = 'brokerage_withdraw_type', // 佣金提现类型
+  BROKERAGE_RECORD_BIZ_TYPE = 'brokerage_record_biz_type', // 佣金业务类型
+  BROKERAGE_RECORD_STATUS = 'brokerage_record_status', // 佣金状态
+  BROKERAGE_WITHDRAW_STATUS = 'brokerage_withdraw_status', // 佣金提现状态
 
   // ========== MALL - 营销模块 ==========
   PROMOTION_DISCOUNT_TYPE = 'promotion_discount_type', // 优惠类型

src/utils/formatter.ts

@@ -0,0 +1,12 @@
+import { fenToYuan } from '@/utils'
+import { TableColumnCtx } from 'element-plus'
+
+// 格式化金额【分转元】
+export const fenToYuanFormat = (
+  row: any,
+  column: TableColumnCtx<any>,
+  cellValue: any,
+  index: number
+) => {
+  return `￥${fenToYuan(cellValue)}`
+}

src/utils/routerHelper.ts

@@ -93,7 +93,10 @@ export const generateRoute = (routes: AppCustomRouteRecordRaw[]): AppRouteRecord
       meta.alwaysShow = true
       const childrenData: AppRouteRecordRaw = {
         path: '',
-        name: toCamelCase(route.path, true),
+        name:
+          route.componentName && route.componentName.length > 0
+            ? route.componentName
+            : toCamelCase(route.path, true),
         redirect: route.redirect,
         meta: meta
       }

src/views/Home/Index.vue

@@ -5,7 +5,7 @@
         <el-row :gutter="20" justify="space-between">
           <el-col :xl="12" :lg="12" :md="12" :sm="24" :xs="24">
             <div class="flex items-center">
-              <img :src="avatar" alt="" class="w-70px h-70px rounded-[50%] mr-20px" />
+              <img :src="avatar" alt="" class="mr-20px h-70px w-70px rounded-[50%]" />
               <div>
                 <div class="text-20px">
                   {{ t('workplace.welcome') }} {{ username }} {{ t('workplace.happyDay') }}
@@ -17,9 +17,9 @@
             </div>
           </el-col>
           <el-col :xl="12" :lg="12" :md="12" :sm="24" :xs="24">
-            <div class="flex h-70px items-center justify-end lt-sm:mt-10px">
+            <div class="h-70px flex items-center justify-end lt-sm:mt-10px">
               <div class="px-8px text-right">
-                <div class="text-14px text-gray-400 mb-20px">{{ t('workplace.project') }}</div>
+                <div class="mb-20px text-14px text-gray-400">{{ t('workplace.project') }}</div>
                 <CountTo
                   class="text-20px"
                   :start-val="0"
@@ -29,7 +29,7 @@
               </div>
               <el-divider direction="vertical" />
               <div class="px-8px text-right">
-                <div class="text-14px text-gray-400 mb-20px">{{ t('workplace.toDo') }}</div>
+                <div class="mb-20px text-14px text-gray-400">{{ t('workplace.toDo') }}</div>
                 <CountTo
                   class="text-20px"
                   :start-val="0"
@@ -39,7 +39,7 @@
               </div>
               <el-divider direction="vertical" border-style="dashed" />
               <div class="px-8px text-right">
-                <div class="text-14px text-gray-400 mb-20px">{{ t('workplace.access') }}</div>
+                <div class="mb-20px text-14px text-gray-400">{{ t('workplace.access') }}</div>
                 <CountTo
                   class="text-20px"
                   :start-val="0"
@@ -58,7 +58,7 @@
     <el-col :xl="16" :lg="16" :md="24" :sm="24" :xs="24" class="mb-10px">
       <el-card shadow="never">
         <template #header>
-          <div class="flex justify-between h-3">
+          <div class="h-3 flex justify-between">
             <span>{{ t('workplace.project') }}</span>
             <el-link type="primary" :underline="false">{{ t('action.more') }}</el-link>
           </div>
@@ -80,7 +80,7 @@
                   <span class="text-16px">{{ item.name }}</span>
                 </div>
                 <div class="mt-15px text-14px text-gray-400">{{ t(item.message) }}</div>
-                <div class="mt-20px text-12px text-gray-400 flex justify-between">
+                <div class="mt-20px flex justify-between text-12px text-gray-400">
                   <span>{{ item.personal }}</span>
                   <span>{{ formatTime(item.time, 'yyyy-MM-dd') }}</span>
                 </div>
@@ -114,7 +114,7 @@
     <el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24" class="mb-10px">
       <el-card shadow="never">
         <template #header>
-          <div class="flex justify-between h-3">
+          <div class="h-3 flex justify-between">
             <span>{{ t('workplace.shortcutOperation') }}</span>
           </div>
         </template>
@@ -133,7 +133,7 @@
       </el-card>
       <el-card shadow="never" class="mt-10px">
         <template #header>
-          <div class="flex justify-between h-3">
+          <div class="h-3 flex justify-between">
             <span>{{ t('workplace.notice') }}</span>
             <el-link type="primary" :underline="false">{{ t('action.more') }}</el-link>
           </div>
@@ -141,7 +141,7 @@
         <el-skeleton :loading="loading" animated>
           <div v-for="(item, index) in notice" :key="`dynamics-${index}`">
             <div class="flex items-center">
-              <img :src="avatar" alt="" class="w-35px h-35px rounded-[50%] mr-20px" />
+              <img :src="avatar" alt="" class="mr-20px h-35px w-35px rounded-[50%]" />
               <div>
                 <div class="text-14px">
                   <Highlight :keys="item.keys.map((v) => t(v))">

src/views/Home/Index2.vue

@@ -20,7 +20,7 @@
                   :duration="2600"
                   :end-val="102400"
                   :start-val="0"
-                  class="text-20px font-700 text-right"
+                  class="text-right text-20px font-700"
                 />
               </div>
             </div>
@@ -49,7 +49,7 @@
                   :duration="2600"
                   :end-val="81212"
                   :start-val="0"
-                  class="text-20px font-700 text-right"
+                  class="text-right text-20px font-700"
                 />
               </div>
             </div>
@@ -78,7 +78,7 @@
                   :duration="2600"
                   :end-val="9280"
                   :start-val="0"
-                  class="text-20px font-700 text-right"
+                  class="text-right text-20px font-700"
                 />
               </div>
             </div>
@@ -107,7 +107,7 @@
                   :duration="2600"
                   :end-val="13600"
                   :start-val="0"
-                  class="text-20px font-700 text-right"
+                  class="text-right text-20px font-700"
                 />
               </div>
             </div>

src/views/Login/Login.vue

@@ -1,19 +1,19 @@
 <template>
   <div
     :class="prefixCls"
-    class="h-[100%] relative lt-xl:bg-[var(--login-bg-color)] lt-sm:px-10px lt-xl:px-10px lt-md:px-10px"
+    class="relative h-[100%] lt-xl:bg-[var(--login-bg-color)] lt-md:px-10px lt-sm:px-10px lt-xl:px-10px"
   >
-    <div class="relative h-full flex mx-auto">
+    <div class="relative mx-auto h-full flex">
       <div
         :class="`${prefixCls}__left flex-1 bg-gray-500 bg-opacity-20 relative p-30px lt-xl:hidden`"
       >
         <!-- 左上角的 logo + 系统标题 -->
-        <div class="flex items-center relative text-white">
+        <div class="relative flex items-center text-white">
-          <img alt="" class="w-48px h-48px mr-10px" src="@/assets/imgs/logo.png" />
+          <img alt="" class="mr-10px h-48px w-48px" src="@/assets/imgs/logo.png" />
           <span class="text-20px font-bold">{{ underlineToHump(appStore.getTitle) }}</span>
         </div>
         <!-- 左边的背景图 + 欢迎语 -->
-        <div class="flex justify-center items-center h-[calc(100%-60px)]">
+        <div class="h-[calc(100%-60px)] flex items-center justify-center">
           <TransitionGroup
             appear
             enter-active-class="animate__animated animate__bounceInLeft"
@@ -21,41 +21,41 @@
           >
             <img key="1" alt="" class="w-350px" src="@/assets/svgs/login-box-bg.svg" />
             <div key="2" class="text-3xl text-white">{{ t('login.welcome') }}</div>
-            <div key="3" class="mt-5 font-normal text-white text-14px">
+            <div key="3" class="mt-5 text-14px font-normal text-white">
               {{ t('login.message') }}
             </div>
           </TransitionGroup>
         </div>
       </div>
-      <div class="flex-1 p-30px lt-sm:p-10px dark:bg-[var(--login-bg-color)] relative">
+      <div class="relative flex-1 p-30px dark:bg-[var(--login-bg-color)] lt-sm:p-10px">
         <!-- 右上角的主题、语言选择 -->
         <div
-          class="flex justify-between items-center text-white at-2xl:justify-end at-xl:justify-end"
+          class="flex items-center justify-between text-white at-2xl:justify-end at-xl:justify-end"
         >
           <div class="flex items-center at-2xl:hidden at-xl:hidden">
-            <img alt="" class="w-48px h-48px mr-10px" src="@/assets/imgs/logo.png" />
+            <img alt="" class="mr-10px h-48px w-48px" src="@/assets/imgs/logo.png" />
             <span class="text-20px font-bold">{{ underlineToHump(appStore.getTitle) }}</span>
           </div>
-          <div class="flex justify-end items-center space-x-10px">
+          <div class="flex items-center justify-end space-x-10px">
             <ThemeSwitch />
-            <LocaleDropdown class="lt-xl:text-white dark:text-white" />
+            <LocaleDropdown class="dark:text-white lt-xl:text-white" />
           </div>
         </div>
         <!-- 右边的登录界面 -->
         <Transition appear enter-active-class="animate__animated animate__bounceInRight">
           <div
-            class="h-full flex items-center m-auto w-[100%] at-2xl:max-w-500px at-xl:max-w-500px at-md:max-w-500px at-lg:max-w-500px"
+            class="m-auto h-full w-[100%] flex items-center at-2xl:max-w-500px at-lg:max-w-500px at-md:max-w-500px at-xl:max-w-500px"
           >
             <!-- 账号登录 -->
-            <LoginForm class="p-20px h-auto m-auto lt-xl:(rounded-3xl light:bg-white)" />
+            <LoginForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />
             <!-- 手机登录 -->
-            <MobileForm class="p-20px h-auto m-auto lt-xl:(rounded-3xl light:bg-white)" />
+            <MobileForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />
             <!-- 二维码登录 -->
-            <QrCodeForm class="p-20px h-auto m-auto lt-xl:(rounded-3xl light:bg-white)" />
+            <QrCodeForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />
             <!-- 注册 -->
-            <RegisterForm class="p-20px h-auto m-auto lt-xl:(rounded-3xl light:bg-white)" />
+            <RegisterForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />
             <!-- 三方登录 -->
-            <SSOLoginVue class="p-20px h-auto m-auto lt-xl:(rounded-3xl light:bg-white)" />
+            <SSOLoginVue class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />
           </div>
         </Transition>
       </div>

src/views/Login/components/LoginForm.vue

@@ -112,13 +112,13 @@
       <el-divider content-position="center">{{ t('login.otherLogin') }}</el-divider>
       <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
         <el-form-item>
-          <div class="flex justify-between w-[100%]">
+          <div class="w-[100%] flex justify-between">
             <Icon
               v-for="(item, key) in socialList"
               :key="key"
               :icon="item.icon"
               :size="30"
-              class="cursor-pointer anticon"
+              class="anticon cursor-pointer"
               color="#999"
               @click="doSocialLogin(item.type)"
             />
@@ -128,7 +128,7 @@
       <el-divider content-position="center">萌新必读</el-divider>
       <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
         <el-form-item>
-          <div class="flex justify-between w-[100%]">
+          <div class="w-[100%] flex justify-between">
             <el-link href="https://doc.iocoder.cn/" target="_blank">📚开发指南</el-link>
             <el-link href="https://doc.iocoder.cn/video/" target="_blank">🔥视频教程</el-link>
             <el-link href="https://www.iocoder.cn/Interview/good-collection/" target="_blank">
@@ -231,6 +231,7 @@ const getCookie = () => {
     }
   }
 }
+const loading = ref() // ElLoading.service 返回的实例
 // 登录
 const handleLogin = async (params) => {
   loginLoading.value = true
@@ -245,7 +246,7 @@ const handleLogin = async (params) => {
     if (!res) {
       return
     }
-    ElLoading.service({
+    loading.value = ElLoading.service({
       lock: true,
       text: '正在加载系统中...',
       background: 'rgba(0, 0, 0, 0.7)'
@@ -265,13 +266,9 @@ const handleLogin = async (params) => {
     } else {
       push({ path: redirect.value || permissionStore.addRouters[0].path })
     }
-  } catch {
-    loginLoading.value = false
   } finally {
-    setTimeout(() => {
+    loginLoading.value = false
-      const loadingInstance = ElLoading.service()
+    loading.value.close()
-      loadingInstance.close()
-    }, 400)
   }
 }
 

src/views/Login/components/LoginFormTitle.vue

@@ -1,5 +1,5 @@
 <template>
-  <h2 class="mb-3 text-2xl font-bold text-center xl:text-3xl enter-x xl:text-center">
+  <h2 class="enter-x mb-3 text-center text-2xl font-bold xl:text-center xl:text-3xl">
     {{ getFormTitle }}
   </h2>
 </template>

src/views/Login/components/QrCodeForm.vue

@@ -10,7 +10,7 @@
     </el-col>
     <el-divider class="enter-x">{{ t('login.qrcode') }}</el-divider>
     <el-col :span="24" style="padding-right: 10px; padding-left: 10px">
-      <div class="w-[100%] mt-15px">
+      <div class="mt-15px w-[100%]">
         <XButton :title="t('login.backLogin')" class="w-[100%]" @click="handleBackLogin()" />
       </div>
     </el-col>

src/views/Login/components/RegisterForm.vue

@@ -29,7 +29,7 @@
           @click="loginRegister()"
         />
       </div>
-      <div class="w-[100%] mt-15px">
+      <div class="mt-15px w-[100%]">
         <XButton :title="t('login.hasUser')" class="w-[100%]" @click="handleBackLogin()" />
       </div>
     </template>

src/views/Profile/Index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="flex">
-    <el-card class="w-1/3 user" shadow="hover">
+    <el-card class="user w-1/3" shadow="hover">
       <template #header>
         <div class="card-header">
           <span>{{ t('profile.user.title') }}</span>
@@ -8,7 +8,7 @@
       </template>
       <ProfileUser />
     </el-card>
-    <el-card class="w-2/3 user ml-3" shadow="hover">
+    <el-card class="user ml-3 w-2/3" shadow="hover">
       <template #header>
         <div class="card-header">
           <span>{{ t('profile.info.title') }}</span>

src/views/bpm/processInstance/detail.vue

@@ -189,6 +189,9 @@
         />
       </template>
     </XModal>
+
+    <!-- 弹窗，回退节点 -->
+    <TaskReturnDialog ref="taskReturnDialogRef" @success="getDetail" />
   </ContentWrap>
 </template>
 <script lang="ts" setup>
@@ -204,6 +207,7 @@ import { setConfAndFields2 } from '@/utils/formCreate'
 import type { ApiAttrs } from '@form-create/element-ui/types/config'
 import { useUserStore } from '@/store/modules/user'
 import { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
+import TaskReturnDialog from './detail/TaskReturnDialogForm.vue'
 
 defineOptions({ name: 'BpmProcessInstanceDetail' })
 
@@ -278,6 +282,9 @@ const getTimelineItemIcon = (item) => {
   if (item.result === 4) {
     return 'el-icon-remove-outline'
   }
+  if (item.result === 5) {
+    return 'el-icon-back'
+  }
   return ''
 }
 const getTimelineItemType = (item) => {
@@ -293,6 +300,9 @@ const getTimelineItemType = (item) => {
   if (item.result === 4) {
     return 'info'
   }
+  if (item.result === 5) {
+    return 'warning'
+  }
   return ''
 }
 
@@ -354,19 +364,11 @@ const handleDelegate = async (task) => {
   console.log(task)
 }
 
+//回退弹框组件
+const taskReturnDialogRef = ref()
 /** 处理审批退回的操作 */
 const handleBack = async (task) => {
-  message.error('暂不支持【退回】功能！')
+  taskReturnDialogRef.value.open(task.id)
-  // 可参考 http://blog.wya1.com/article/636697030/details/7296
-  // const data = {
-  //   id: task.id,
-  //   assigneeUserId: 1
-  // }
-  // backTask(data).then(response => {
-  //   this.$modal.msgSuccess("回退成功！");
-  //   this.getDetail(); // 获得最新详情
-  // });
-  console.log(task)
 }
 
 // ========== 高亮流程图 ==========

src/views/bpm/processInstance/detail/TaskReturnDialogForm.vue

@@ -0,0 +1,90 @@
+<template>
+  <Dialog v-model="dialogVisible" title="回退" width="500">
+    <el-form
+      ref="formRef"
+      v-loading="formLoading"
+      :model="formData"
+      :rules="formRules"
+      label-width="110px"
+    >
+      <el-form-item label="退回节点" prop="targetDefinitionKey">
+        <el-select v-model="formData.targetDefinitionKey" clearable style="width: 100%">
+          <el-option
+            v-for="item in returnList"
+            :key="item.definitionKey"
+            :label="item.name"
+            :value="item.definitionKey"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="回退理由" prop="reason">
+        <el-input v-model="formData.reason" clearable placeholder="请输入回退理由" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+<script lang="ts" name="TaskRollbackDialogForm" setup>
+import * as TaskApi from '@/api/bpm/task'
+
+const message = useMessage() // 消息弹窗
+const dialogVisible = ref(false) // 弹窗的是否展示
+const formLoading = ref(false) // 表单的加载中
+const formData = ref({
+  id: '',
+  targetDefinitionKey: undefined,
+  reason: ''
+})
+const formRules = ref({
+  targetDefinitionKey: [{ required: true, message: '必须选择回退节点', trigger: 'change' }],
+  reason: [{ required: true, message: '回退理由不能为空', trigger: 'blur' }]
+})
+
+const formRef = ref() // 表单 Ref
+const returnList = ref([])
+/** 打开弹窗 */
+const open = async (id: string) => {
+  returnList.value = await TaskApi.getReturnList({ taskId: id })
+  if (returnList.value.length === 0) {
+    message.warning('当前没有可回退的节点')
+    return false
+  }
+  dialogVisible.value = true
+  resetForm()
+  formData.value.id = id
+}
+defineExpose({ open }) // 提供 openModal 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const submitForm = async () => {
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    await TaskApi.returnTask(formData.value)
+    message.success('回退成功')
+    dialogVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    id: '',
+    targetDefinitionKey: undefined,
+    reason: ''
+  }
+  formRef.value?.resetFields()
+}
+</script>

src/views/infra/build/index.vue

@@ -2,7 +2,7 @@
   <ContentWrap>
     <el-row>
       <el-col>
-        <div class="mb-2 float-right">
+        <div class="float-right mb-2">
           <el-button size="small" type="primary" @click="showJson">生成 JSON</el-button>
           <el-button size="small" type="success" @click="showOption">生成 Options</el-button>
           <el-button size="small" type="danger" @click="showTemplate">生成组件</el-button>

src/views/infra/codegen/components/Preview.vue

@@ -9,11 +9,18 @@
             :data="preview.fileTree"
             :expand-on-click-node="false"
             highlight-current
+            default-expand-all
             @node-click="handleNodeClick"
           />
         </el-scrollbar>
       </el-card>
-      <el-card class="w-3/4 ml-3" :gutter="12" shadow="hover">
+      <el-card
+        v-loading="loading"
+        :gutter="12"
+        class="ml-3 w-2/3"
+        element-loading-text="加载代码中..."
+        shadow="hover"
+      >
         <el-tabs v-model="preview.activeName">
           <el-tab-pane
             v-for="item in previewCodegen"
@@ -22,7 +29,7 @@
             :key="item.filePath"
           >
             <XTextButton style="float: right" :title="t('common.copy')" @click="copy(item.code)" />
-            <el-scrollbar height="600px">
+            <el-scrollbar height="745px">
               <pre><code v-dompurify-html="highlightedCode(item)" class="hljs"></code></pre>
             </el-scrollbar>
           </el-tab-pane>

src/views/infra/server/index.vue

@@ -14,6 +14,9 @@ const src = ref(import.meta.env.VITE_BASE_URL + '/admin/applications')
 /** 初始化 */
 onMounted(async () => {
   try {
+    // 友情提示：如果访问出现 404 问题：
+    // 1）boot 参考 https://doc.iocoder.cn/server-monitor/ 解决；
+    // 2）cloud 参考 https://cloud.iocoder.cn/server-monitor/ 解决
     const data = await ConfigApi.getConfigKeyApi('url.spring-boot-admin')
     if (data && data.length > 0) {
       src.value = data

src/views/infra/webSocket/index.vue

@@ -7,7 +7,7 @@
         </div>
       </template>
       <div class="flex items-center">
-        <span class="text-lg font-medium mr-4"> 连接状态: </span>
+        <span class="mr-4 text-lg font-medium"> 连接状态: </span>
         <el-tag :color="getTagColor">{{ status }}</el-tag>
       </div>
       <hr class="my-4" />
@@ -20,7 +20,7 @@
           {{ getIsOpen ? '关闭连接' : '开启连接' }}
         </el-button>
       </div>
-      <p class="text-lg font-medium mt-4">设置</p>
+      <p class="mt-4 text-lg font-medium">设置</p>
       <hr class="my-4" />
       <el-input
         v-model="sendValue"
@@ -43,7 +43,7 @@
         <ul>
           <li v-for="item in getList" :key="item.time" class="mt-2">
             <div class="flex items-center">
-              <span class="mr-2 text-primary font-medium">收到消息:</span>
+              <span class="text-primary mr-2 font-medium">收到消息:</span>
               <span>{{ formatDate(item.time) }}</span>
             </div>
             <div>

src/views/mall/product/comment/CommentForm.vue

@@ -8,7 +8,7 @@
       v-loading="formLoading"
     >
       <el-form-item label="商品" prop="spuId">
-        <div @click="handleSelectSpu" class="w-60px h-60px">
+        <div @click="handleSelectSpu" class="h-60px w-60px">
           <div v-if="spuData && spuData.picUrl">
             <el-image :src="spuData.picUrl" />
           </div>
@@ -18,7 +18,7 @@
         </div>
       </el-form-item>
       <el-form-item label="商品规格" prop="skuId" v-if="formData.spuId">
-        <div @click="handleSelectSku" class="w-60px h-60px">
+        <div @click="handleSelectSku" class="h-60px w-60px">
           <div v-if="skuData && skuData.picUrl">
             <el-image :src="skuData.picUrl" />
           </div>

src/views/mall/product/comment/index.vue

@@ -63,12 +63,12 @@
       <el-table-column label="用户名称" align="center" prop="userNickname" width="80" />
       <el-table-column label="商品信息" align="center" min-width="300">
         <template #default="scope">
-          <div class="flex row items-center gap-x-4px">
+          <div class="row flex items-center gap-x-4px">
             <el-image
               v-if="scope.row.skuPicUrl"
               :src="scope.row.skuPicUrl"
               :preview-src-list="[scope.row.skuPicUrl]"
-              class="w-40px h-40px shrink-0"
+              class="h-40px w-40px shrink-0"
               preview-teleported
             />
             <div>{{ scope.row.spuName }}</div>
@@ -95,7 +95,7 @@
               :src="picUrl"
               :preview-src-list="scope.row.picUrls"
               :initial-index="index"
-              class="w-40px h-40px"
+              class="h-40px w-40px"
               preview-teleported
             />
           </div>

src/views/mall/product/spu/components/SkuList.vue

@@ -80,7 +80,7 @@
       <el-table-column align="center" label="一级返佣(元)" min-width="168">
         <template #default="{ row }">
           <el-input-number
-            v-model="row.subCommissionFirstPrice"
+            v-model="row.firstBrokerageRecord"
             :min="0"
             :precision="2"
             :step="0.1"
@@ -91,7 +91,7 @@
       <el-table-column align="center" label="二级返佣(元)" min-width="168">
         <template #default="{ row }">
           <el-input-number
-            v-model="row.subCommissionSecondPrice"
+            v-model="row.secondBrokerageRecord"
             :min="0"
             :precision="2"
             :step="0.1"
@@ -124,7 +124,7 @@
     <el-table-column v-if="isComponent" type="selection" width="45" />
     <el-table-column align="center" label="图片" min-width="80">
       <template #default="{ row }">
-        <el-image :src="row.picUrl" class="w-60px h-60px" @click="imagePreview(row.picUrl)" />
+        <el-image :src="row.picUrl" class="h-60px w-60px" @click="imagePreview(row.picUrl)" />
       </template>
     </el-table-column>
     <template v-if="formData!.specType && !isBatch">
@@ -181,12 +181,12 @@
     <template v-if="formData!.subCommissionType">
       <el-table-column align="center" label="一级返佣(元)" min-width="80">
         <template #default="{ row }">
-          {{ row.subCommissionFirstPrice }}
+          {{ row.firstBrokerageRecord }}
         </template>
       </el-table-column>
       <el-table-column align="center" label="二级返佣(元)" min-width="80">
         <template #default="{ row }">
-          {{ row.subCommissionSecondPrice }}
+          {{ row.secondBrokerageRecord }}
         </template>
       </el-table-column>
     </template>
@@ -204,7 +204,7 @@
     <el-table-column v-if="isComponent" type="selection" width="45" />
     <el-table-column align="center" label="图片" min-width="80">
       <template #default="{ row }">
-        <el-image :src="row.picUrl" class="w-60px h-60px" @click="imagePreview(row.picUrl)" />
+        <el-image :src="row.picUrl" class="h-60px w-60px" @click="imagePreview(row.picUrl)" />
       </template>
     </el-table-column>
     <template v-if="formData!.specType">
@@ -296,8 +296,8 @@ const skuList = ref<Sku[]>([
     stock: 0, // 库存
     weight: 0, // 商品重量
     volume: 0, // 商品体积
-    subCommissionFirstPrice: 0, // 一级分销的佣金
+    firstBrokerageRecord: 0, // 一级分销的佣金
-    subCommissionSecondPrice: 0 // 二级分销的佣金
+    secondBrokerageRecord: 0 // 二级分销的佣金
   }
 ]) // 批量添加时的临时数据
 
@@ -416,8 +416,8 @@ const generateTableData = (propertyList: any[]) => {
       stock: 0,
       weight: 0,
       volume: 0,
-      subCommissionFirstPrice: 0,
+      firstBrokerageRecord: 0,
-      subCommissionSecondPrice: 0
+      secondBrokerageRecord: 0
     }
     // 如果存在属性相同的 sku 则不做处理
     const index = formData.value!.skus!.findIndex(
@@ -492,8 +492,8 @@ watch(
           stock: 0,
           weight: 0,
           volume: 0,
-          subCommissionFirstPrice: 0,
+          firstBrokerageRecord: 0,
-          subCommissionSecondPrice: 0
+          secondBrokerageRecord: 0
         }
       ]
     }

src/views/mall/product/spu/components/SkuTableSelect.vue

@@ -12,7 +12,7 @@
         <template #default="{ row }">
           <el-image
             :src="row.picUrl"
-            class="w-30px h-30px"
+            class="h-30px w-30px"
             :preview-src-list="[row.picUrl]"
             preview-teleported
           />

src/views/mall/product/spu/components/SpuTableSelect.vue

@@ -73,7 +73,7 @@
           <template #default="{ row }">
             <el-image
               :src="row.picUrl"
-              class="w-30px h-30px"
+              class="h-30px w-30px"
               :preview-src-list="[row.picUrl]"
               preview-teleported
             />

src/views/mall/product/spu/form/BasicInfoForm.vue

@@ -117,7 +117,7 @@
           />
         </el-form-item>
         <el-form-item v-if="formData.specType" label="商品属性">
-          <el-button class="mr-15px mb-10px" @click="attributesAddFormRef.open">添加规格</el-button>
+          <el-button class="mb-10px mr-15px" @click="attributesAddFormRef.open">添加规格</el-button>
           <ProductAttributes :propertyList="propertyList" @success="generateSkus" />
         </el-form-item>
         <template v-if="formData.specType && propertyList.length > 0">
@@ -153,14 +153,14 @@
       {{ row.subCommissionType ? '自行设置' : '默认设置' }}
     </template>
     <template #picUrl="{ row }">
-      <el-image :src="row.picUrl" class="w-60px h-60px" @click="imagePreview(row.picUrl)" />
+      <el-image :src="row.picUrl" class="h-60px w-60px" @click="imagePreview(row.picUrl)" />
     </template>
     <template #sliderPicUrls="{ row }">
       <el-image
         v-for="(item, index) in row.sliderPicUrls"
         :key="index"
         :src="item.url"
-        class="w-60px h-60px mr-10px"
+        class="mr-10px h-60px w-60px"
         @click="imagePreview(row.sliderPicUrls)"
       />
     </template>
@@ -332,8 +332,8 @@ defineExpose({ validate })
 const changeSubCommissionType = () => {
   // 默认为零，类型切换后也要重置为零
   for (const item of formData.skus) {
-    item.subCommissionFirstPrice = 0
+    item.firstBrokerageRecord = 0
-    item.subCommissionSecondPrice = 0
+    item.secondBrokerageRecord = 0
   }
 }
 
@@ -352,8 +352,8 @@ const onChangeSpec = () => {
       stock: 0,
       weight: 0,
       volume: 0,
-      subCommissionFirstPrice: 0,
+      firstBrokerageRecord: 0,
-      subCommissionSecondPrice: 0
+      secondBrokerageRecord: 0
     }
   ]
 }

src/views/mall/product/spu/form/index.vue

@@ -82,8 +82,8 @@ const formData = ref<ProductSpuApi.Spu>({
       stock: 0, // 库存
       weight: 0, // 商品重量
       volume: 0, // 商品体积
-      subCommissionFirstPrice: 0, // 一级分销的佣金
+      firstBrokerageRecord: 0, // 一级分销的佣金
-      subCommissionSecondPrice: 0 // 二级分销的佣金
+      secondBrokerageRecord: 0 // 二级分销的佣金
     }
   ],
   description: '', // 商品详情
@@ -112,15 +112,15 @@ const getDetail = async () => {
           item.price = floatToFixed2(item.price)
           item.marketPrice = floatToFixed2(item.marketPrice)
           item.costPrice = floatToFixed2(item.costPrice)
-          item.subCommissionFirstPrice = floatToFixed2(item.subCommissionFirstPrice)
+          item.firstBrokerageRecord = floatToFixed2(item.firstBrokerageRecord)
-          item.subCommissionSecondPrice = floatToFixed2(item.subCommissionSecondPrice)
+          item.secondBrokerageRecord = floatToFixed2(item.secondBrokerageRecord)
         } else {
           // 回显价格分转元
           item.price = formatToFraction(item.price)
           item.marketPrice = formatToFraction(item.marketPrice)
           item.costPrice = formatToFraction(item.costPrice)
-          item.subCommissionFirstPrice = formatToFraction(item.subCommissionFirstPrice)
+          item.firstBrokerageRecord = formatToFraction(item.firstBrokerageRecord)
-          item.subCommissionSecondPrice = formatToFraction(item.subCommissionSecondPrice)
+          item.secondBrokerageRecord = formatToFraction(item.secondBrokerageRecord)
         }
       })
       formData.value = res
@@ -149,8 +149,8 @@ const submitForm = async () => {
       item.price = convertToInteger(item.price)
       item.marketPrice = convertToInteger(item.marketPrice)
       item.costPrice = convertToInteger(item.costPrice)
-      item.subCommissionFirstPrice = convertToInteger(item.subCommissionFirstPrice)
+      item.firstBrokerageRecord = convertToInteger(item.firstBrokerageRecord)
-      item.subCommissionSecondPrice = convertToInteger(item.subCommissionSecondPrice)
+      item.secondBrokerageRecord = convertToInteger(item.secondBrokerageRecord)
     })
     // 处理轮播图列表
     const newSliderPicUrls: any[] = []

src/views/mall/product/spu/index.vue

@@ -125,7 +125,7 @@
       <el-table-column key="id" align="center" label="商品编号" prop="id" />
       <el-table-column label="商品图" min-width="80">
         <template #default="{ row }">
-          <el-image :src="row.picUrl" class="w-30px h-30px" @click="imagePreview(row.picUrl)" />
+          <el-image :src="row.picUrl" class="h-30px w-30px" @click="imagePreview(row.picUrl)" />
         </template>
       </el-table-column>
       <el-table-column :show-overflow-tooltip="true" label="商品名称" min-width="300" prop="name" />

src/views/mall/promotion/bargain/activity/index.vue

@@ -32,7 +32,7 @@
       <template #spuId="{ row }">
         <el-image
           :src="row.picUrl"
-          class="w-30px h-30px align-middle mr-5px"
+          class="mr-5px h-30px w-30px align-middle"
           @click="imagePreview(row.picUrl)"
         />
         <span class="align-middle">{{ row.spuName }}</span>

src/views/mall/promotion/combination/activity/index.vue

@@ -33,7 +33,7 @@
       <template #spuId="{ row }">
         <el-image
           :src="row.picUrl"
-          class="w-30px h-30px align-middle mr-5px"
+          class="mr-5px h-30px w-30px align-middle"
           @click="imagePreview(row.picUrl)"
         />
         <span class="align-middle">{{ row.spuName }}</span>

src/views/mall/promotion/components/SpuAndSkuList.vue

@@ -18,7 +18,7 @@
     <el-table-column key="id" align="center" label="商品编号" prop="id" />
     <el-table-column label="商品图" min-width="80">
       <template #default="{ row }">
-        <el-image :src="row.picUrl" class="w-30px h-30px" @click="imagePreview(row.picUrl)" />
+        <el-image :src="row.picUrl" class="h-30px w-30px" @click="imagePreview(row.picUrl)" />
       </template>
     </el-table-column>
     <el-table-column :show-overflow-tooltip="true" label="商品名称" min-width="300" prop="name" />
@@ -41,7 +41,7 @@ import { SpuProperty } from '@/views/mall/promotion/components/index'
 defineOptions({ name: 'PromotionSpuAndSkuList' })
 
 const props = defineProps<{
-  spuList: T[] // TODO 为了方便兼容后续可能有需要展示多个 spu 的情况暂时保持，如果后续都是只操作一个 spu 的话则可更改为接受一个 spu 或保持
+  spuList: T[]
   ruleConfig: RuleConfig[]
   spuPropertyListP: SpuProperty<T>[]
 }>()

src/views/mall/promotion/components/SpuSelect.vue

@@ -70,7 +70,7 @@
         <el-table-column key="id" align="center" label="商品编号" prop="id" />
         <el-table-column label="商品图" min-width="80">
           <template #default="{ row }">
-            <el-image :src="row.picUrl" class="w-30px h-30px" @click="imagePreview(row.picUrl)" />
+            <el-image :src="row.picUrl" class="h-30px w-30px" @click="imagePreview(row.picUrl)" />
           </template>
         </el-table-column>
         <el-table-column

src/views/mall/promotion/coupon/template/CouponTemplateForm.vue

@@ -26,7 +26,7 @@
         v-if="formData.productScope === PromotionProductScopeEnum.SPU.scope"
         prop="productSpuIds"
       >
-        <div class="flex items-center gap-1 flex-wrap">
+        <div class="flex flex-wrap items-center gap-1">
           <div class="select-box spu-pic" v-for="(spu, index) in productSpus" :key="spu.id">
             <el-image :src="spu.picUrl" />
             <Icon icon="ep:circle-close-filled" class="del-icon" @click="handleRemoveSpu(index)" />
@@ -62,7 +62,7 @@
         <el-input-number
           v-model="formData.discountPrice"
           placeholder="请输入优惠金额，单位：元"
-          class="!w-400px mr-2"
+          class="mr-2 !w-400px"
           :precision="2"
           :min="0"
         />
@@ -76,7 +76,7 @@
         <el-input-number
           v-model="formData.discountPercent"
           placeholder="优惠券折扣不能小于 1 折，且不可大于 9.9 折"
-          class="!w-400px mr-2"
+          class="mr-2 !w-400px"
           :precision="1"
           :min="1"
           :max="9.9"
@@ -91,7 +91,7 @@
         <el-input-number
           v-model="formData.discountLimitPrice"
           placeholder="请输入最多优惠"
-          class="!w-400px mr-2"
+          class="mr-2 !w-400px"
           :precision="2"
           :min="0"
         />
@@ -101,7 +101,7 @@
         <el-input-number
           v-model="formData.usePrice"
           placeholder="无门槛请设为 0"
-          class="!w-400px mr-2"
+          class="mr-2 !w-400px"
           :precision="2"
           :min="0"
         />
@@ -117,7 +117,7 @@
         <el-input-number
           v-model="formData.totalCount"
           placeholder="发放数量，没有之后不能领取或发放，-1 为不限制"
-          class="!w-400px mr-2"
+          class="mr-2 !w-400px"
           :precision="0"
           :min="-1"
         />
@@ -127,7 +127,7 @@
         <el-input-number
           v-model="formData.takeLimitCount"
           placeholder="设置为 -1 时，可无限领取"
-          class="!w-400px mr-2"
+          class="mr-2 !w-400px"
           :precision="0"
           :min="-1"
         />

src/views/mall/promotion/seckill/activity/index.vue

@@ -36,7 +36,7 @@
       <template #spuId="{ row }">
         <el-image
           :src="row.picUrl"
-          class="w-30px h-30px align-middle mr-5px"
+          class="mr-5px h-30px w-30px align-middle"
           @click="imagePreview(row.picUrl)"
         />
         <span class="align-middle">{{ row.spuName }}</span>

src/views/mall/promotion/seckill/config/index.vue

@@ -36,7 +36,7 @@
           v-for="(item, index) in row.sliderPicUrls"
           :key="index"
           :src="item"
-          class="w-60px h-60px mr-10px"
+          class="mr-10px h-60px w-60px"
           @click="imagePreview(row.sliderPicUrls)"
         />
       </template>

src/views/mall/trade/afterSale/detail/index.vue

@@ -57,7 +57,7 @@
           v-for="(item, index) in formData.applyPicUrls"
           :key="index"
           :src="item.url"
-          class="w-60px h-60px mr-10px"
+          class="mr-10px h-60px w-60px"
           @click="imagePreview(formData.applyPicUrls)"
         />
       </el-descriptions-item>
@@ -126,28 +126,22 @@
       <el-descriptions-item labelClassName="no-colon">
         <el-timeline>
           <el-timeline-item
-            v-for="saleLog in formData.afterSaleLog"
+            v-for="saleLog in formData.logs"
             :key="saleLog.id"
             :timestamp="formatDate(saleLog.createTime)"
             placement="top"
           >
-            <el-card>
+            <div class="el-timeline-right-content">
-              <span>用户类型：</span>
+              <span>{{ saleLog.content }}</span>
-              <dict-tag :type="DICT_TYPE.USER_TYPE" :value="saleLog.userType" class="mr-10px" />
+            </div>
-              <span>售后状态(之前)：</span>
+            <template #dot>
-              <dict-tag
+              <span
-                :type="DICT_TYPE.TRADE_AFTER_SALE_STATUS"
+                :style="{ backgroundColor: getUserTypeColor(saleLog.userType) }"
-                :value="saleLog.beforeStatus"
+                class="dot-node-style"
-                class="mr-10px"
+              >
-              />
+                {{ getDictLabel(DICT_TYPE.USER_TYPE, saleLog.userType)[0] || '系' }}
-              <span>售后状态(之后)：</span>
+              </span>
-              <dict-tag
+            </template>
-                :type="DICT_TYPE.TRADE_AFTER_SALE_STATUS"
-                :value="saleLog.afterStatus"
-                class="mr-10px"
-              />
-              <span>操作明细：{{ saleLog.content }}</span>
-            </el-card>
           </el-timeline-item>
         </el-timeline>
       </el-descriptions-item>
@@ -160,28 +154,52 @@
 <script lang="ts" setup>
 import * as AfterSaleApi from '@/api/mall/trade/afterSale/index'
 import { floatToFixed2 } from '@/utils'
-import { DICT_TYPE } from '@/utils/dict'
+import { DICT_TYPE, getDictLabel, getDictObj } from '@/utils/dict'
 import { formatDate } from '@/utils/formatTime'
 import UpdateAuditReasonForm from '@/views/mall/trade/afterSale/form/AfterSaleDisagreeForm.vue'
 import { createImageViewer } from '@/components/ImageViewer'
 import { isArray } from '@/utils/is'
+import { useTagsViewStore } from '@/store/modules/tagsView'
 
 defineOptions({ name: 'TradeAfterSaleDetail' })
 
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 const { params } = useRoute() // 查询参数
+const { push, currentRoute } = useRouter() // 路由
 const formData = ref({
   order: {},
-  afterSaleLog: []
+  logs: []
 })
 const updateAuditReasonFormRef = ref() // 拒绝售后表单 Ref
 
+/** 获得 userType 颜色 */
+const getUserTypeColor = (type: number) => {
+  const dict = getDictObj(DICT_TYPE.USER_TYPE, type)
+  switch (dict?.colorType) {
+    case 'success':
+      return '#67C23A'
+    case 'info':
+      return '#909399'
+    case 'warning':
+      return '#E6A23C'
+    case 'danger':
+      return '#F56C6C'
+  }
+  return '#409EFF'
+}
+
 /** 获得详情 */
 const getDetail = async () => {
   const id = params.orderId as unknown as number
   if (id) {
-    formData.value = await AfterSaleApi.getAfterSale(id)
+    const res = await AfterSaleApi.getAfterSale(id)
+    // 没有表单信息则关闭页面返回
+    if (res == null) {
+      message.notifyError('售后订单不存在')
+      close()
+    }
+    formData.value = res
   }
 }
 
@@ -240,7 +258,12 @@ const imagePreview = (args) => {
     urlList
   })
 }
-
+const { delView } = useTagsViewStore() // 视图操作
+/** 关闭 tag */
+const close = () => {
+  delView(unref(currentRoute))
+  push({ name: 'TradeAfterSale' })
+}
 onMounted(async () => {
   await getDetail()
 })
@@ -277,4 +300,51 @@ onMounted(async () => {
     }
   }
 }
+
+// 时间线样式调整
+:deep(.el-timeline) {
+  margin: 10px 0px 0px 160px;
+
+  .el-timeline-item__wrapper {
+    position: relative;
+    top: -20px;
+
+    .el-timeline-item__timestamp {
+      position: absolute !important;
+      top: 10px;
+      left: -150px;
+    }
+  }
+
+  .el-timeline-right-content {
+    display: flex;
+    align-items: center;
+    min-height: 30px;
+    padding: 10px;
+    background-color: #f7f8fa;
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 10px;
+      left: 13px;
+      border-width: 8px; /* 调整尖角大小 */
+      border-style: solid;
+      border-color: transparent #f7f8fa transparent transparent; /* 尖角颜色，左侧朝向 */
+    }
+  }
+
+  .dot-node-style {
+    width: 20px;
+    height: 20px;
+    position: absolute;
+    left: -5px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    border-radius: 50%;
+    color: #fff;
+    font-size: 10px;
+  }
+}
 </style>

src/views/mall/trade/afterSale/index.vue

@@ -123,7 +123,7 @@
           <div class="flex items-center">
             <el-image
               :src="row.picUrl"
-              class="w-30px h-30px mr-10px"
+              class="mr-10px h-30px w-30px"
               @click="imagePreview(row.picUrl)"
             />
             <span class="mr-10px">{{ row.spuName }}</span>

src/views/mall/trade/brokerage/record/index.vue

@@ -0,0 +1,169 @@
+<template>
+  <ContentWrap>
+    <!-- 搜索工作栏 -->
+    <el-form
+      class="-mb-15px"
+      :model="queryParams"
+      ref="queryFormRef"
+      :inline="true"
+      label-width="68px"
+    >
+      <el-form-item label="用户编号" prop="userId">
+        <el-input
+          v-model="queryParams.userId"
+          placeholder="请输入用户编号"
+          clearable
+          @keyup.enter="handleQuery"
+          class="!w-240px"
+        />
+      </el-form-item>
+      <el-form-item label="业务类型" prop="bizType">
+        <el-select
+          v-model="queryParams.bizType"
+          placeholder="请选择业务类型"
+          clearable
+          class="!w-240px"
+        >
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.BROKERAGE_RECORD_BIZ_TYPE)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="状态" prop="status">
+        <el-select v-model="queryParams.status" placeholder="请选择状态" clearable class="!w-240px">
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.BROKERAGE_RECORD_STATUS)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="创建时间" prop="createTime">
+        <el-date-picker
+          v-model="queryParams.createTime"
+          value-format="YYYY-MM-DD HH:mm:ss"
+          type="daterange"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+          class="!w-240px"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+      </el-form-item>
+    </el-form>
+  </ContentWrap>
+
+  <!-- 列表 -->
+  <ContentWrap>
+    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+      <el-table-column label="编号" align="center" prop="id" min-width="60" />
+      <el-table-column label="用户编号" align="center" prop="userId" min-width="80" />
+      <el-table-column label="头像" align="center" prop="userAvatar" width="70px">
+        <template #default="scope">
+          <el-avatar :src="scope.row.userAvatar" />
+        </template>
+      </el-table-column>
+      <el-table-column label="昵称" align="center" prop="userNickname" min-width="80px" />
+      <el-table-column label="业务类型" align="center" prop="bizType" min-width="85">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.BROKERAGE_RECORD_BIZ_TYPE" :value="scope.row.bizType" />
+        </template>
+      </el-table-column>
+      <el-table-column label="业务编号" align="center" prop="bizId" min-width="80" />
+      <el-table-column label="标题" align="center" prop="title" min-width="110" />
+      <el-table-column
+        label="金额"
+        align="center"
+        prop="price"
+        min-width="60"
+        :formatter="fenToYuanFormat"
+      />
+      <el-table-column label="说明" align="center" prop="description" min-width="120" />
+      <el-table-column label="状态" align="center" prop="status" min-width="85">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.BROKERAGE_RECORD_STATUS" :value="scope.row.status" />
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="解冻时间"
+        align="center"
+        prop="unfreezeTime"
+        :formatter="dateFormatter"
+        width="170px"
+      />
+      <el-table-column
+        label="创建时间"
+        align="center"
+        prop="createTime"
+        :formatter="dateFormatter"
+        width="170px"
+      />
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </ContentWrap>
+</template>
+
+<script setup lang="ts">
+import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
+import { dateFormatter } from '@/utils/formatTime'
+import * as BrokerageRecordApi from '@/api/mall/trade/brokerage/record'
+import { fenToYuanFormat } from '@/utils/formatter'
+
+defineOptions({ name: 'TradeBrokerageRecord' })
+
+const loading = ref(true) // 列表的加载中
+const total = ref(0) // 列表的总页数
+const list = ref([]) // 列表的数据
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  userId: null,
+  bizType: null,
+  price: null,
+  status: null,
+  createTime: []
+})
+const queryFormRef = ref() // 搜索的表单
+
+/** 查询列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await BrokerageRecordApi.getBrokerageRecordPage(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+
+/** 初始化 **/
+onMounted(() => {
+  getList()
+})
+</script>

src/views/mall/trade/brokerage/user/BrokerageOrderListDialog.vue

@@ -0,0 +1,152 @@
+<template>
+  <Dialog v-model="dialogVisible" title="推广人列表" width="75%">
+    <ContentWrap>
+      <!-- 搜索工作栏 -->
+      <el-form
+        class="-mb-15px"
+        :model="queryParams"
+        ref="queryFormRef"
+        :inline="true"
+        label-width="85px"
+      >
+        <el-form-item label="用户类型" prop="level">
+          <el-radio-group v-model="queryParams.level" @change="handleQuery">
+            <el-radio-button checked>全部</el-radio-button>
+            <el-radio-button label="1">一级推广人</el-radio-button>
+            <el-radio-button label="2">二级推广人</el-radio-button>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="状态" prop="status">
+          <el-select
+            v-model="queryParams.status"
+            placeholder="请选择状态"
+            clearable
+            class="!w-240px"
+          >
+            <el-option
+              v-for="dict in getIntDictOptions(DICT_TYPE.BROKERAGE_RECORD_STATUS)"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="绑定时间" prop="createTime">
+          <el-date-picker
+            v-model="queryParams.createTime"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            type="daterange"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+            class="!w-240px"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+          <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+        </el-form-item>
+      </el-form>
+    </ContentWrap>
+
+    <!-- 列表 -->
+    <ContentWrap>
+      <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+        <el-table-column label="订单编号" align="center" prop="bizId" min-width="80px" />
+        <el-table-column label="用户编号" align="center" prop="sourceUserId" min-width="80px" />
+        <el-table-column label="头像" align="center" prop="sourceUserAvatar" width="70px">
+          <template #default="scope">
+            <el-avatar :src="scope.row.sourceUserAvatar" />
+          </template>
+        </el-table-column>
+        <el-table-column label="昵称" align="center" prop="sourceUserNickname" min-width="80px" />
+        <el-table-column
+          label="佣金"
+          align="center"
+          prop="price"
+          min-width="100px"
+          :formatter="fenToYuanFormat"
+        />
+        <el-table-column label="状态" align="center" prop="status" min-width="85">
+          <template #default="scope">
+            <dict-tag :type="DICT_TYPE.BROKERAGE_RECORD_STATUS" :value="scope.row.status" />
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="创建时间"
+          align="center"
+          prop="createTime"
+          :formatter="dateFormatter"
+          width="170px"
+        />
+      </el-table>
+      <!-- 分页 -->
+      <Pagination
+        :total="total"
+        v-model:page="queryParams.pageNo"
+        v-model:limit="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </ContentWrap>
+  </Dialog>
+</template>
+
+<script setup lang="ts">
+import { dateFormatter } from '@/utils/formatTime'
+import * as BrokerageRecordApi from '@/api/mall/trade/brokerage/record'
+import { BrokerageRecordBizTypeEnum } from '@/utils/constants'
+import { fenToYuanFormat } from '@/utils/formatter'
+import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
+
+/** 推广订单列表 */
+defineOptions({ name: 'BrokerageOrderListDialog' })
+
+const message = useMessage() // 消息弹窗
+
+const loading = ref(true) // 列表的加载中
+const total = ref(0) // 列表的总页数
+const list = ref([]) // 列表的数据
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  userId: null,
+  bizType: BrokerageRecordBizTypeEnum.ORDER.type,
+  level: '',
+  createTime: [],
+  status: null
+})
+const queryFormRef = ref() // 搜索的表单
+
+/** 打开弹窗 */
+const dialogVisible = ref(false) // 弹窗的是否展示
+const open = async (userId: any) => {
+  dialogVisible.value = true
+  queryParams.userId = userId
+  resetQuery()
+}
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+/** 查询列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await BrokerageRecordApi.getBrokerageRecordPage(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value?.resetFields()
+  handleQuery()
+}
+</script>

src/views/mall/trade/brokerage/user/BrokerageUserListDialog.vue

@@ -0,0 +1,137 @@
+<template>
+  <Dialog v-model="dialogVisible" title="推广人列表" width="75%">
+    <ContentWrap>
+      <!-- 搜索工作栏 -->
+      <el-form
+        class="-mb-15px"
+        :model="queryParams"
+        ref="queryFormRef"
+        :inline="true"
+        label-width="85px"
+      >
+        <el-form-item label="用户类型" prop="level">
+          <el-radio-group v-model="queryParams.level" @change="handleQuery">
+            <el-radio-button checked>全部</el-radio-button>
+            <el-radio-button label="1">一级推广人</el-radio-button>
+            <el-radio-button label="2">二级推广人</el-radio-button>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="绑定时间" prop="bindUserTime">
+          <el-date-picker
+            v-model="queryParams.bindUserTime"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            type="daterange"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+            class="!w-240px"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+          <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+        </el-form-item>
+      </el-form>
+    </ContentWrap>
+
+    <!-- 列表 -->
+    <ContentWrap>
+      <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+        <el-table-column label="用户编号" align="center" prop="id" min-width="80px" />
+        <el-table-column label="头像" align="center" prop="avatar" width="70px">
+          <template #default="scope">
+            <el-avatar :src="scope.row.avatar" />
+          </template>
+        </el-table-column>
+        <el-table-column label="昵称" align="center" prop="nickname" min-width="80px" />
+        <el-table-column
+          label="推广人数"
+          align="center"
+          prop="brokerageUserCount"
+          min-width="80px"
+        />
+        <el-table-column
+          label="推广订单数量"
+          align="center"
+          prop="brokerageOrderCount"
+          min-width="110px"
+        />
+        <el-table-column label="推广资格" align="center" prop="brokerageEnabled" min-width="80px">
+          <template #default="scope">
+            <el-tag v-if="scope.row.brokerageEnabled">有</el-tag>
+            <el-tag v-else type="info">无</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="绑定时间"
+          align="center"
+          prop="bindUserTime"
+          :formatter="dateFormatter"
+          width="170px"
+        />
+      </el-table>
+      <!-- 分页 -->
+      <Pagination
+        :total="total"
+        v-model:page="queryParams.pageNo"
+        v-model:limit="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </ContentWrap>
+  </Dialog>
+</template>
+
+<script setup lang="ts">
+import { dateFormatter } from '@/utils/formatTime'
+import * as BrokerageUserApi from '@/api/mall/trade/brokerage/user'
+
+/** 推广人列表 */
+defineOptions({ name: 'BrokerageUserListDialog' })
+
+const message = useMessage() // 消息弹窗
+
+const loading = ref(true) // 列表的加载中
+const total = ref(0) // 列表的总页数
+const list = ref([]) // 列表的数据
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  bindUserId: null,
+  level: '',
+  bindUserTime: []
+})
+const queryFormRef = ref() // 搜索的表单
+
+/** 打开弹窗 */
+const dialogVisible = ref(false) // 弹窗的是否展示
+const open = async (bindUserId: any) => {
+  dialogVisible.value = true
+  queryParams.bindUserId = bindUserId
+  resetQuery()
+}
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+/** 查询列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await BrokerageUserApi.getBrokerageUserPage(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value?.resetFields()
+  handleQuery()
+}
+</script>

src/views/mall/trade/brokerage/user/UpdateBindUserForm.vue

@@ -0,0 +1,127 @@
+<template>
+  <Dialog v-model="dialogVisible" title="修改上级推广人" width="500">
+    <el-form
+      ref="formRef"
+      v-loading="formLoading"
+      :model="formData"
+      :rules="formRules"
+      label-width="80px"
+    >
+      <el-form-item label="推广人" prop="bindUserId">
+        <el-input
+          v-model="formData.bindUserId"
+          placeholder="请输入推广员编号"
+          v-loading="formLoading"
+        >
+          <template #append>
+            <el-button @click="handleGetUser"><Icon icon="ep:search" class="mr-5px" /></el-button>
+          </template>
+        </el-input>
+      </el-form-item>
+    </el-form>
+    <el-descriptions v-if="bindUser" :column="1" border>
+      <el-descriptions-item label="头像">
+        <el-avatar :src="bindUser.avatar" />
+      </el-descriptions-item>
+      <el-descriptions-item label="昵称">{{ bindUser.nickname }}</el-descriptions-item>
+      <el-descriptions-item label="推广资格">
+        <el-tag v-if="bindUser.brokerageEnabled">有</el-tag>
+        <el-tag v-else type="info">无</el-tag>
+      </el-descriptions-item>
+      <el-descriptions-item label="成为推广员的时间">
+        {{ formatDate(bindUser.brokerageTime) }}
+      </el-descriptions-item>
+    </el-descriptions>
+    <template #footer>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+<script lang="ts" setup>
+import * as BrokerageUserApi from '@/api/mall/trade/brokerage/user'
+import { formatDate } from '@/utils/formatTime'
+
+/** 修改上级推广人表单 */
+defineOptions({ name: 'UpdateBindUserForm' })
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const dialogVisible = ref(false) // 弹窗的是否展示
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formData = ref()
+const formRef = ref() // 表单 Ref
+const formRules = reactive({
+  bindUserId: [{ required: true, message: '推广员人不能为空', trigger: 'blur' }]
+})
+
+/** 打开弹窗 */
+const open = async (row: BrokerageUserApi.BrokerageUserVO) => {
+  resetForm()
+  // 设置数据
+  formData.value.id = row.id
+  formData.value.bindUserId = row.bindUserId
+  // 反显上级推广人
+  if (row.bindUserId) {
+    await handleGetUser()
+  }
+  dialogVisible.value = true
+}
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+/** 修改上级推广人 */
+const submitForm = async () => {
+  if (formLoading.value) return
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+
+  if (!bindUser.value) {
+    message.error('请先查询并确认推广人')
+    return
+  }
+
+  // 提交请求
+  formLoading.value = true
+  try {
+    // 发起修改
+    await BrokerageUserApi.updateBindUser(formData.value)
+    message.success(t('common.updateSuccess'))
+    dialogVisible.value = false
+    // 发送操作成功的事件
+    emit('success', true)
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    id: 0,
+    bindUserId: undefined
+  }
+  formRef.value?.resetFields()
+  bindUser.value = undefined
+}
+
+/** 查询推广员 */
+const bindUser = ref<BrokerageUserApi.BrokerageUserVO>()
+const handleGetUser = async () => {
+  if (formData.value.bindUserId == formData.value.id) {
+    message.error('不能绑定自己为推广人')
+    return
+  }
+
+  formLoading.value = true
+  bindUser.value = await BrokerageUserApi.getBrokerageUser(formData.value.bindUserId)
+  if (!bindUser.value) {
+    message.warning('推广员不存在')
+  }
+  formLoading.value = false
+}
+</script>

src/views/mall/trade/brokerage/user/index.vue

@@ -0,0 +1,305 @@
+<template>
+  <ContentWrap>
+    <!-- 搜索工作栏 -->
+    <el-form
+      class="-mb-15px"
+      :model="queryParams"
+      ref="queryFormRef"
+      :inline="true"
+      label-width="85px"
+    >
+      <el-form-item label="推广员编号" prop="bindUserId">
+        <el-input
+          v-model="queryParams.bindUserId"
+          placeholder="请输入推广员编号"
+          clearable
+          @keyup.enter="handleQuery"
+          class="!w-240px"
+        />
+      </el-form-item>
+      <el-form-item label="推广资格" prop="brokerageEnabled">
+        <el-select
+          v-model="queryParams.brokerageEnabled"
+          class="!w-240px"
+          clearable
+          placeholder="请选择推广资格"
+        >
+          <el-option label="有" :value="true" />
+          <el-option label="无" :value="false" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="创建时间" prop="createTime">
+        <el-date-picker
+          v-model="queryParams.createTime"
+          value-format="YYYY-MM-DD HH:mm:ss"
+          type="daterange"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+          class="!w-240px"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+      </el-form-item>
+    </el-form>
+  </ContentWrap>
+
+  <!-- 列表 -->
+  <ContentWrap>
+    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+      <el-table-column label="用户编号" align="center" prop="id" min-width="80px" />
+      <el-table-column label="头像" align="center" prop="avatar" width="70px">
+        <template #default="scope">
+          <el-avatar :src="scope.row.avatar" />
+        </template>
+      </el-table-column>
+      <el-table-column label="昵称" align="center" prop="nickname" min-width="80px" />
+      <el-table-column label="推广人数" align="center" prop="brokerageUserCount" width="80px" />
+      <el-table-column
+        label="推广订单数量"
+        align="center"
+        prop="brokerageOrderCount"
+        min-width="110px"
+      />
+      <el-table-column
+        label="推广订单金额"
+        align="center"
+        prop="brokerageOrderPrice"
+        min-width="110px"
+        :formatter="fenToYuanFormat"
+      />
+      <el-table-column
+        label="已提现金额"
+        align="center"
+        prop="withdrawPrice"
+        min-width="100px"
+        :formatter="fenToYuanFormat"
+      />
+      <el-table-column label="已提现次数" align="center" prop="withdrawCount" min-width="100px" />
+      <el-table-column
+        label="未提现金额"
+        align="center"
+        prop="price"
+        min-width="100px"
+        :formatter="fenToYuanFormat"
+      />
+      <el-table-column
+        label="冻结中佣金"
+        align="center"
+        prop="frozenPrice"
+        min-width="100px"
+        :formatter="fenToYuanFormat"
+      />
+      <el-table-column label="推广资格" align="center" prop="brokerageEnabled" min-width="80px">
+        <template #default="scope">
+          <el-switch
+            v-model="scope.row.brokerageEnabled"
+            active-text="有"
+            inactive-text="无"
+            inline-prompt
+            :disabled="!checkPermi(['trade:brokerage-user:update-bind-user'])"
+            @change="handleBrokerageEnabledChange(scope.row)"
+          />
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="成为推广员时间"
+        align="center"
+        prop="brokerageTime"
+        :formatter="dateFormatter"
+        width="170px"
+      />
+      <el-table-column label="上级推广员编号" align="center" prop="bindUserId" width="150px" />
+      <el-table-column
+        label="推广员绑定时间"
+        align="center"
+        prop="bindUserTime"
+        :formatter="dateFormatter"
+        width="170px"
+      />
+      <el-table-column label="操作" align="center" width="150px" fixed="right">
+        <template #default="scope">
+          <el-dropdown
+            @command="(command) => handleCommand(command, scope.row)"
+            v-hasPermi="[
+              'trade:brokerage-user:user-query',
+              'trade:brokerage-user:order-query',
+              'trade:brokerage-user:update-bind-user',
+              'trade:brokerage-user:clear-bind-user'
+            ]"
+          >
+            <el-button link type="primary">
+              <Icon icon="ep:d-arrow-right" />
+              更多
+            </el-button>
+            <template #dropdown>
+              <el-dropdown-menu>
+                <el-dropdown-item
+                  command="openBrokerageUserTable"
+                  v-if="checkPermi(['trade:brokerage-user:user-query'])"
+                >
+                  推广人
+                </el-dropdown-item>
+                <el-dropdown-item
+                  command="openBrokerageOrderTable"
+                  v-if="checkPermi(['trade:brokerage-user:order-query'])"
+                >
+                  推广订单
+                </el-dropdown-item>
+                <el-dropdown-item
+                  command="openUpdateBindUserForm"
+                  v-if="checkPermi(['trade:brokerage-user:update-bind-user'])"
+                >
+                  修改上级推广人
+                </el-dropdown-item>
+                <el-dropdown-item
+                  command="handleClearBindUser"
+                  v-if="
+                    scope.row.bindUserId && checkPermi(['trade:brokerage-user:clear-bind-user'])
+                  "
+                >
+                  清除上级推广人
+                </el-dropdown-item>
+              </el-dropdown-menu>
+            </template>
+          </el-dropdown>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </ContentWrap>
+  <!-- 修改上级推广人表单 -->
+  <UpdateBindUserForm ref="updateBindUserFormRef" @success="getList" />
+  <!-- 推广人列表 -->
+  <BrokerageUserListDialog ref="brokerageUserListDialogRef" />
+  <!-- 推广订单列表 -->
+  <BrokerageOrderListDialog ref="brokerageOrderListDialogRef" />
+</template>
+
+<script setup lang="ts">
+import { dateFormatter } from '@/utils/formatTime'
+import * as BrokerageUserApi from '@/api/mall/trade/brokerage/user'
+import { checkPermi } from '@/utils/permission'
+import { fenToYuanFormat } from '@/utils/formatter'
+import UpdateBindUserForm from '@/views/mall/trade/brokerage/user/UpdateBindUserForm.vue'
+import BrokerageUserListDialog from '@/views/mall/trade/brokerage/user/BrokerageUserListDialog.vue'
+import BrokerageOrderListDialog from '@/views/mall/trade/brokerage/user/BrokerageOrderListDialog.vue'
+
+defineOptions({ name: 'TradeBrokerageUser' })
+
+const message = useMessage() // 消息弹窗
+
+const loading = ref(true) // 列表的加载中
+const total = ref(0) // 列表的总页数
+const list = ref([]) // 列表的数据
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  bindUserId: null,
+  brokerageEnabled: null,
+  createTime: []
+})
+const queryFormRef = ref() // 搜索的表单
+
+/** 查询列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await BrokerageUserApi.getBrokerageUserPage(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+
+const handleCommand = (command: string, row: BrokerageUserApi.BrokerageUserVO) => {
+  switch (command) {
+    case 'openBrokerageUserTable':
+      openBrokerageUserTable(row.id)
+      break
+    case 'openBrokerageOrderTable':
+      openBrokerageOrderTable(row.id)
+      break
+    case 'openUpdateBindUserForm':
+      openUpdateBindUserForm(row)
+      break
+    case 'handleClearBindUser':
+      handleClearBindUser(row)
+      break
+  }
+}
+
+/** 打开推广人列表 */
+const brokerageUserListDialogRef = ref()
+const openBrokerageUserTable = (id: number) => {
+  brokerageUserListDialogRef.value.open(id)
+}
+
+/** 打开推广订单列表 */
+const brokerageOrderListDialogRef = ref()
+const openBrokerageOrderTable = (id: number) => {
+  brokerageOrderListDialogRef.value.open(id)
+}
+
+/** 打开表单：修改上级推广人 */
+const updateBindUserFormRef = ref()
+const openUpdateBindUserForm = (row: BrokerageUserApi.BrokerageUserVO) => {
+  updateBindUserFormRef.value.open(row)
+}
+
+/** 清除上级推广人 */
+const handleClearBindUser = async (row: BrokerageUserApi.BrokerageUserVO) => {
+  try {
+    // 二次确认
+    await message.confirm(`确认要清除"${row.nickname}"的上级推广人吗？`)
+    // 发起修改
+    await BrokerageUserApi.clearBindUser({ id: row.id })
+    message.success('清除成功')
+    // 刷新列表
+    await getList()
+  } catch {}
+}
+
+/** 推广资格 开通/关闭 */
+const handleBrokerageEnabledChange = async (row: BrokerageUserApi.BrokerageUserVO) => {
+  try {
+    // 二次确认
+    const text = row.brokerageEnabled ? '开通' : '关闭'
+    await message.confirm(`确认要${text}"${row.nickname}"的推广资格吗？`)
+    // 发起修改
+    await BrokerageUserApi.updateBrokerageEnabled({ id: row.id, enabled: row.brokerageEnabled })
+    message.success(text + '成功')
+    // 刷新列表
+    await getList()
+  } catch {
+    // 异常时，需要重置回之前的值
+    row.brokerageEnabled = !row.brokerageEnabled
+  }
+}
+
+/** 初始化 **/
+onMounted(() => {
+  getList()
+})
+</script>

src/views/mall/trade/brokerage/withdraw/BrokerageWithdrawRejectForm.vue

@@ -0,0 +1,73 @@
+<template>
+  <Dialog title="审核" v-model="dialogVisible">
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="100px"
+      v-loading="formLoading"
+    >
+      <el-form-item label="驳回原因" prop="auditReason">
+        <el-input v-model="formData.auditReason" type="textarea" placeholder="请输入驳回原因" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import * as BrokerageWithdrawApi from '@/api/mall/trade/brokerage/withdraw'
+
+const message = useMessage() // 消息弹窗
+
+const dialogVisible = ref(false) // 弹窗的是否展示
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formData = ref({
+  id: undefined,
+  auditReason: undefined
+})
+const formRules = reactive({
+  auditReason: [{ required: true, message: '驳回原因不能为空', trigger: 'blur' }]
+})
+const formRef = ref() // 表单 Ref
+
+/** 打开弹窗 */
+const open = async (id: number) => {
+  dialogVisible.value = true
+  resetForm()
+  formData.value.id = id
+}
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const submitForm = async () => {
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    const data = formData.value as unknown as BrokerageWithdrawApi.BrokerageWithdrawVO
+    await BrokerageWithdrawApi.rejectBrokerageWithdraw(data)
+    message.success('驳回成功')
+    dialogVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    id: undefined,
+    auditReason: undefined
+  }
+  formRef.value?.resetFields()
+}
+</script>

src/views/mall/trade/brokerage/withdraw/index.vue

@@ -0,0 +1,264 @@
+<template>
+  <ContentWrap>
+    <!-- 搜索工作栏 -->
+    <el-form
+      class="-mb-15px"
+      :model="queryParams"
+      ref="queryFormRef"
+      :inline="true"
+      label-width="68px"
+    >
+      <el-form-item label="用户编号" prop="userId">
+        <el-input
+          v-model="queryParams.userId"
+          placeholder="请输入用户编号"
+          clearable
+          @keyup.enter="handleQuery"
+          class="!w-240px"
+        />
+      </el-form-item>
+      <el-form-item label="提现类型" prop="type">
+        <el-select
+          v-model="queryParams.type"
+          placeholder="请选择提现类型"
+          clearable
+          class="!w-240px"
+        >
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.BROKERAGE_WITHDRAW_TYPE)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="账号" prop="accountNo">
+        <el-input
+          v-model="queryParams.accountNo"
+          placeholder="请输入账号"
+          clearable
+          @keyup.enter="handleQuery"
+          class="!w-240px"
+        />
+      </el-form-item>
+      <el-form-item label="提现银行" prop="bankName">
+        <el-select
+          v-model="queryParams.bankName"
+          placeholder="请选择提现银行"
+          clearable
+          class="!w-240px"
+        >
+          <el-option
+            v-for="dict in getStrDictOptions(DICT_TYPE.BROKERAGE_BANK_NAME)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="状态" prop="status">
+        <el-select v-model="queryParams.status" placeholder="请选择状态" clearable class="!w-240px">
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.BROKERAGE_WITHDRAW_STATUS)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="申请时间" prop="createTime">
+        <el-date-picker
+          v-model="queryParams.createTime"
+          value-format="YYYY-MM-DD HH:mm:ss"
+          type="daterange"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+          class="!w-240px"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+      </el-form-item>
+    </el-form>
+  </ContentWrap>
+
+  <!-- 列表 -->
+  <ContentWrap>
+    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+      <el-table-column label="编号" align="left" prop="id" min-width="60px" />
+      <el-table-column label="用户信息" align="left" min-width="120px">
+        <template #default="scope">
+          <div>编号：{{ scope.row.userId }}</div>
+          <div>昵称：{{ scope.row.userNickname }}</div>
+        </template>
+      </el-table-column>
+      <el-table-column label="提现金额" align="left" prop="price" min-width="80px">
+        <template #default="scope">
+          <div>金　额：￥{{ fenToYuan(scope.row.price) }}</div>
+          <div>手续费：￥{{ fenToYuan(scope.row.feePrice) }}</div>
+        </template>
+      </el-table-column>
+      <el-table-column label="提现方式" align="left" prop="type" min-width="120px">
+        <template #default="scope">
+          <div v-if="scope.row.type === BrokerageWithdrawTypeEnum.WALLET.type"> 余额 </div>
+          <div v-else>
+            {{ getDictLabel(DICT_TYPE.BROKERAGE_WITHDRAW_TYPE, scope.row.type) }}账号：
+            {{ scope.row.accountNo }}
+          </div>
+          <template v-if="scope.row.type === BrokerageWithdrawTypeEnum.BANK.type">
+            <div>真实姓名：{{ scope.row.name }}</div>
+            <div>
+              银行名称：
+              <dict-tag :type="DICT_TYPE.BROKERAGE_BANK_NAME" :value="scope.row.bankName" />
+            </div>
+            <div>开户地址：{{ scope.row.bankAddress }}</div>
+          </template>
+        </template>
+      </el-table-column>
+      <el-table-column label="收款码" align="left" prop="accountQrCodeUrl" width="70px">
+        <template #default="scope">
+          <el-image
+            :src="scope.row.accountQrCodeUrl"
+            class="w-40px h-40px"
+            :preview-src-list="[scope.row.accountQrCodeUrl]"
+            preview-teleported
+          />
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="申请时间"
+        align="left"
+        prop="createTime"
+        :formatter="dateFormatter"
+        width="170px"
+      />
+      <el-table-column label="备注" align="left" prop="remark" />
+      <el-table-column label="状态" align="left" prop="status" min-width="120px">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.BROKERAGE_WITHDRAW_STATUS" :value="scope.row.status" />
+          <div v-if="scope.row.auditTime" class="text-xs">
+            时间：{{ formatDate(scope.row.auditTime) }}
+          </div>
+          <div v-if="scope.row.auditReason" class="text-xs">
+            原因：{{ scope.row.auditReason }}
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="left" width="110px" fixed="right">
+        <template #default="scope">
+          <template v-if="scope.row.status === BrokerageWithdrawStatusEnum.AUDITING.status">
+            <el-button
+              link
+              type="primary"
+              @click="handleApprove(scope.row.id)"
+              v-hasPermi="['trade:brokerage-withdraw:audit']"
+            >
+              通过
+            </el-button>
+            <el-button
+              link
+              type="danger"
+              @click="openForm(scope.row.id)"
+              v-hasPermi="['trade:brokerage-withdraw:audit']"
+            >
+              驳回
+            </el-button>
+          </template>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </ContentWrap>
+
+  <!-- 表单弹窗：添加/修改 -->
+  <BrokerageWithdrawRejectForm ref="formRef" @success="getList" />
+</template>
+
+<script setup lang="ts">
+import { DICT_TYPE, getDictLabel, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
+import { dateFormatter, formatDate } from '@/utils/formatTime'
+import * as BrokerageWithdrawApi from '@/api/mall/trade/brokerage/withdraw'
+import BrokerageWithdrawRejectForm from './BrokerageWithdrawRejectForm.vue'
+import { BrokerageWithdrawStatusEnum, BrokerageWithdrawTypeEnum } from '@/utils/constants'
+import { fenToYuanFormat } from '@/utils/formatter'
+import { fenToYuan } from '@/utils'
+
+defineOptions({ name: 'BrokerageWithdraw' })
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+const loading = ref(true) // 列表的加载中
+const total = ref(0) // 列表的总页数
+const list = ref([]) // 列表的数据
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  userId: null,
+  type: null,
+  name: null,
+  accountNo: null,
+  bankName: null,
+  status: null,
+  auditReason: null,
+  auditTime: [],
+  remark: null,
+  createTime: []
+})
+const queryFormRef = ref() // 搜索的表单
+
+/** 查询列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await BrokerageWithdrawApi.getBrokerageWithdrawPage(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+
+/** 添加/修改操作 */
+const formRef = ref()
+const openForm = (id: number) => {
+  formRef.value.open(id)
+}
+
+/** 审核通过 */
+const handleApprove = async (id: number) => {
+  try {
+    loading.value = true
+    await message.confirm('确定要审核通过吗？')
+    await BrokerageWithdrawApi.approveBrokerageWithdraw(id)
+    await message.success(t('common.success'))
+    await getList()
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 初始化 **/
+onMounted(() => {
+  getList()
+})
+</script>

src/views/mall/trade/config/index.vue

@@ -0,0 +1,243 @@
+<template>
+  <ContentWrap>
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="120px"
+      v-loading="formLoading"
+    >
+      <el-form-item label="hideId" v-show="false">
+        <el-input v-model="formData.id" />
+      </el-form-item>
+
+      <el-tabs>
+        <el-tab-pane label="配送">
+          <el-form-item label="启用包邮" prop="deliveryExpressFreeEnabled">
+            <el-switch v-model="formData.deliveryExpressFreeEnabled" style="user-select: none" />
+            <el-text class="w-full" size="small" type="info"> 商城是否启用全场包邮 </el-text>
+          </el-form-item>
+          <el-form-item label="满额包邮" prop="deliveryExpressFreePrice">
+            <el-input-number
+              v-model="formData.deliveryExpressFreePrice"
+              placeholder="请输入满额包邮"
+              class="!w-xs"
+            />
+            <el-text class="w-full" size="small" type="info"> 商城商品满多少金额即可包邮 </el-text>
+          </el-form-item>
+        </el-tab-pane>
+        <el-tab-pane label="分销">
+          <el-form-item label="分佣启用" prop="brokerageEnabled">
+            <el-switch v-model="formData.brokerageEnabled" style="user-select: none" />
+            <el-text class="w-full" size="small" type="info"> 商城是否开启分销模式 </el-text>
+          </el-form-item>
+          <el-form-item label="分佣模式" prop="brokerageEnabledCondition">
+            <el-radio-group v-model="formData.brokerageEnabledCondition">
+              <el-radio
+                v-for="dict in getIntDictOptions(DICT_TYPE.BROKERAGE_ENABLED_CONDITION)"
+                :key="dict.value"
+                :label="dict.value"
+              >
+                {{ dict.label }}
+              </el-radio>
+            </el-radio-group>
+            <el-text class="w-full" size="small" type="info">
+              人人分销：每个用户都可以成为推广员
+            </el-text>
+            <el-text class="w-full" size="small" type="info">
+              指定分销：仅可在后台手动设置推广员
+            </el-text>
+          </el-form-item>
+          <el-form-item label="分销关系绑定" prop="brokerageBindMode">
+            <el-radio-group v-model="formData.brokerageBindMode">
+              <el-radio
+                v-for="dict in getIntDictOptions(DICT_TYPE.BROKERAGE_BIND_MODE)"
+                :key="dict.value"
+                :label="dict.value"
+              >
+                {{ dict.label }}
+              </el-radio>
+            </el-radio-group>
+            <el-text class="w-full" size="small" type="info">
+              没有推广人：只要用户没有推广人，随时都可以绑定推广关系
+            </el-text>
+            <el-text class="w-full" size="small" type="info">
+              新用户：只有新用户注册时或首次进入系统时才可以绑定推广关系
+            </el-text>
+          </el-form-item>
+          <el-form-item label="分销海报图">
+            <UploadImgs v-model="formData.brokeragePostUrls" width="75px" height="125px" />
+            <el-text class="w-full" size="small" type="info">
+              个人中心分销海报图片，建议尺寸600x1000
+            </el-text>
+          </el-form-item>
+          <el-form-item label="一级返佣比例" prop="brokerageFirstPercent">
+            <el-input-number
+              v-model="formData.brokerageFirstPercent"
+              placeholder="请输入一级返佣比例"
+              class="!w-xs"
+            />
+            <el-text class="w-full" size="small" type="info">
+              订单交易成功后给推广人返佣的百分比
+            </el-text>
+          </el-form-item>
+          <el-form-item label="二级返佣比例" prop="brokerageSecondPercent">
+            <el-input-number
+              v-model="formData.brokerageSecondPercent"
+              placeholder="请输入二级返佣比例"
+              class="!w-xs"
+            />
+            <el-text class="w-full" size="small" type="info">
+              订单交易成功后给推广人的推荐人返佣的百分比
+            </el-text>
+          </el-form-item>
+          <el-form-item label="佣金冻结天数" prop="brokerageFrozenDays">
+            <el-input-number
+              v-model="formData.brokerageFrozenDays"
+              placeholder="请输入佣金冻结天数"
+              class="!w-xs"
+            />
+            <el-text class="w-full" size="small" type="info">
+              防止用户退款，佣金被提现了，所以需要设置佣金冻结时间，单位：天
+            </el-text>
+          </el-form-item>
+          <el-form-item label="提现最低金额" prop="brokerageWithdrawMinPrice">
+            <el-input-number
+              v-model="formData.brokerageWithdrawMinPrice"
+              placeholder="请输入提现最低金额"
+              class="!w-xs"
+            />
+            <el-text class="w-full" size="small" type="info">
+              用户提现最低金额限制，单位：元
+            </el-text>
+          </el-form-item>
+          <el-form-item label="提现手续费" prop="brokerageWithdrawFeePercent">
+            <el-input-number
+              v-model="formData.brokerageWithdrawFeePercent"
+              placeholder="请输入提现手续费"
+              class="!w-xs"
+            />
+            <el-text class="w-full" size="small" type="info">
+              提现手续费百分比，范围0-100，0为无提现手续费，例：设置10，即收取10%手续费，提现100元，到账90元，10元手续费
+            </el-text>
+          </el-form-item>
+          <el-form-item label="提现方式" prop="brokerageWithdrawType">
+            <el-checkbox-group v-model="formData.brokerageWithdrawType">
+              <el-checkbox
+                v-for="dict in getIntDictOptions(DICT_TYPE.BROKERAGE_WITHDRAW_TYPE)"
+                :key="dict.value"
+                :label="dict.value"
+              >
+                {{ dict.label }}
+              </el-checkbox>
+            </el-checkbox-group>
+            <el-text class="w-full" size="small" type="info"> 商城开通提现的付款方式 </el-text>
+          </el-form-item>
+          <el-form-item label="提现银行" prop="brokerageBankNames">
+            <el-select v-model="formData.brokerageBankNames" placeholder="请选择提现银行" multiple>
+              <el-option
+                v-for="dict in getIntDictOptions(DICT_TYPE.BROKERAGE_BANK_NAME)"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+            <el-text class="w-full" size="small" type="info"> 商城开通提现的银行列表 </el-text>
+          </el-form-item>
+        </el-tab-pane>
+      </el-tabs>
+
+      <el-form-item>
+        <el-button type="primary" @click="submitForm" :loading="formLoading"> 保存 </el-button>
+      </el-form-item>
+    </el-form>
+  </ContentWrap>
+</template>
+
+<script setup lang="ts">
+import * as ConfigApi from '@/api/mall/trade/config'
+import { BrokerageBindModeEnum, BrokerageEnabledConditionEnum } from '@/utils/constants'
+import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
+
+defineOptions({ name: 'TradeConfig' })
+
+const message = useMessage() // 消息弹窗
+
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formRef = ref()
+const formData = ref({
+  id: null,
+  deliveryExpressFreeEnabled: true,
+  deliveryExpressFreePrice: 0,
+  brokerageEnabled: true,
+  brokerageEnabledCondition: BrokerageEnabledConditionEnum.ALL.condition,
+  brokerageBindMode: BrokerageBindModeEnum.ANYTIME.mode,
+  brokeragePostUrls: [],
+  brokerageFirstPercent: 0,
+  brokerageSecondPercent: 0,
+  brokerageWithdrawMinPrice: 0,
+  brokerageWithdrawFeePercent: 0,
+  brokerageBankNames: [],
+  brokerageFrozenDays: 0,
+  brokerageWithdrawType: []
+})
+const formRules = reactive({
+  deliveryExpressFreePrice: [{ required: true, message: '满额包邮不能为空', trigger: 'blur' }],
+  brokerageEnabledCondition: [{ required: true, message: '分佣模式不能为空', trigger: 'blur' }],
+  brokerageBindMode: [{ required: true, message: '分销关系绑定模式不能为空', trigger: 'blur' }],
+  brokerageFirstPercent: [{ required: true, message: '一级返佣比例不能为空', trigger: 'blur' }],
+  brokerageSecondPercent: [{ required: true, message: '二级返佣比例不能为空', trigger: 'blur' }],
+  brokerageWithdrawMinPrice: [
+    { required: true, message: '用户提现最低金额不能为空', trigger: 'blur' }
+  ],
+  brokerageWithdrawFeePercent: [{ required: true, message: '提现手续费不能为空', trigger: 'blur' }],
+  brokerageBankNames: [{ required: true, message: '提现银行不能为空', trigger: 'blur' }],
+  brokerageFrozenDays: [{ required: true, message: '佣金冻结时间不能为空', trigger: 'blur' }],
+  brokerageWithdrawType: [
+    {
+      required: true,
+      message: '提现方式不能为空',
+      trigger: 'change'
+    }
+  ]
+})
+
+const submitForm = async () => {
+  if (formLoading.value) return
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    const data = formData.value as unknown as ConfigApi.ConfigVO
+    data.brokeragePostUrls = formData.value.brokeragePostUrls.map((item: any) => {
+      return item?.url ? item.url : item
+    })
+    await ConfigApi.saveTradeConfig(data)
+    message.success('保存成功')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 查询交易中心配置 */
+const getConfig = async () => {
+  formLoading.value = true
+  try {
+    const data = await ConfigApi.getTradeConfig()
+    if (data != null) {
+      data.brokeragePostUrls = data.brokeragePostUrls.map((url) => ({ url }))
+      formData.value = data
+    }
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 初始化 **/
+onMounted(() => {
+  getConfig()
+})
+</script>

src/views/mall/trade/delivery/expressTemplate/ExpressTemplateForm.vue

@@ -28,13 +28,13 @@
               <!--   区域数据太多，用赖加载方式，要不然性能有问题 -->
               <el-tree-select
                 v-model="row.areaIds"
-                lazy
                 :load="loadChargeArea"
                 :props="defaultProps"
-                multiple
                 node-key="id"
+                multiple
                 check-strictly
                 show-checkbox
+                lazy
                 check-on-click-node
                 :render-after-expand="false"
                 :cache-data="areaCache"

src/views/mall/trade/order/detail/index.vue

@@ -40,12 +40,17 @@
       <el-descriptions-item label="订单状态: ">
         <dict-tag :type="DICT_TYPE.TRADE_ORDER_STATUS" :value="formData.status!" />
       </el-descriptions-item>
-      <!-- TODO @puhui999：根据状态，进行展示按钮 -->
       <el-descriptions-item label-class-name="no-colon">
-        <el-button type="primary" @click="openForm('updatePrice')">调整价格</el-button>
+        <el-button v-if="formData.status! === 0" type="primary" @click="updatePrice">
-        <el-button type="primary" @click="openForm('remark')">备注</el-button>
+          调整价格
-        <el-button type="primary" @click="openForm('delivery')">发货</el-button>
+        </el-button>
-        <el-button type="primary" @click="openForm('updateAddress')">修改地址</el-button>
+        <el-button type="primary" @click="remark">备注</el-button>
+        <el-button v-if="formData.status! === 10" type="primary" @click="delivery">
+          发货
+        </el-button>
+        <el-button v-if="formData.status! === 10" type="primary" @click="updateAddress">
+          修改地址
+        </el-button>
       </el-descriptions-item>
       <el-descriptions-item>
         <template #label><span style="color: red">提醒: </span></template>
@@ -152,11 +157,22 @@
       <el-descriptions-item labelClassName="no-colon">
         <el-timeline>
           <el-timeline-item
-            v-for="(log, index) in formData.orderLog"
+            v-for="(log, index) in formData.logs"
             :key="index"
             :timestamp="formatDate(log.createTime!)"
+            placement="top"
           >
+            <div class="el-timeline-right-content">
               {{ log.content }}
+            </div>
+            <template #dot>
+              <span
+                :style="{ backgroundColor: getUserTypeColor(log.userType!) }"
+                class="dot-node-style"
+              >
+                {{ getDictLabel(DICT_TYPE.USER_TYPE, log.userType)[0] }}
+              </span>
+            </template>
           </el-timeline-item>
         </el-timeline>
       </el-descriptions-item>
@@ -173,42 +189,55 @@
 import * as TradeOrderApi from '@/api/mall/trade/order'
 import { floatToFixed2 } from '@/utils'
 import { formatDate } from '@/utils/formatTime'
-import { DICT_TYPE } from '@/utils/dict'
+import { DICT_TYPE, getDictLabel, getDictObj } from '@/utils/dict'
 import OrderUpdateRemarkForm from '@/views/mall/trade/order/form/OrderUpdateRemarkForm.vue'
 import OrderDeliveryForm from '@/views/mall/trade/order/form/OrderDeliveryForm.vue'
 import OrderUpdateAddressForm from '@/views/mall/trade/order/form/OrderUpdateAddressForm.vue'
 import OrderUpdatePriceForm from '@/views/mall/trade/order/form/OrderUpdatePriceForm.vue'
 import * as DeliveryExpressApi from '@/api/mall/trade/delivery/express'
+import { useTagsViewStore } from '@/store/modules/tagsView'
 
 defineOptions({ name: 'TradeOrderDetail' })
 
 const message = useMessage() // 消息弹窗
 
+/** 获得 userType 颜色 */
+const getUserTypeColor = (type: number) => {
+  const dict = getDictObj(DICT_TYPE.USER_TYPE, type)
+  switch (dict?.colorType) {
+    case 'success':
+      return '#67C23A'
+    case 'info':
+      return '#909399'
+    case 'warning':
+      return '#E6A23C'
+    case 'danger':
+      return '#F56C6C'
+  }
+  return '#409EFF'
+}
+
 // 订单详情
 const formData = ref<TradeOrderApi.OrderVO>({
-  orderLog: [] // TODO @puhui999：orderLogs
+  logs: []
 })
 
-// TODO @puhui999：这个最好也拆掉哈
+/** 各种操作 */
-const deliveryFormRef = ref() // 发货表单 Ref
 const updateRemarkForm = ref() // 订单备注表单 Ref
-const updateAddressFormRef = ref() // 收货地址表单 Ref
+const remark = () => {
-const updatePriceFormRef = ref() // 订单调价表单 Ref
-const openForm = (type: string) => {
-  switch (type) {
-    case 'remark':
   updateRemarkForm.value?.open(formData.value)
-      break
+}
-    case 'delivery':
+const deliveryFormRef = ref() // 发货表单 Ref
+const delivery = () => {
   deliveryFormRef.value?.open(formData.value)
-      break
+}
-    case 'updateAddress':
+const updateAddressFormRef = ref() // 收货地址表单 Ref
+const updateAddress = () => {
   updateAddressFormRef.value?.open(formData.value)
-      break
+}
-    case 'updatePrice':
+const updatePriceFormRef = ref() // 订单调价表单 Ref
+const updatePrice = () => {
   updatePriceFormRef.value?.open(formData.value)
-      break
-  }
 }
 
 /** 获得详情 */
@@ -217,10 +246,23 @@ const getDetail = async () => {
   const id = params.orderId as unknown as number
   if (id) {
     const res = (await TradeOrderApi.getOrder(id)) as TradeOrderApi.OrderVO
+    // 没有表单信息则关闭页面返回
+    if (res === null) {
+      message.error('交易订单不存在')
+      close()
+    }
     formData.value = res
   }
 }
 
+/** 关闭 tag */
+const { delView } = useTagsViewStore() // 视图操作
+const { push, currentRoute } = useRouter() // 路由
+const close = () => {
+  delView(unref(currentRoute))
+  push({ name: 'TradeOrder' })
+}
+
 /** 复制 */
 const clipboardSuccess = () => {
   message.success('复制成功')
@@ -267,4 +309,51 @@ onMounted(async () => {
     }
   }
 }
+
+// 时间线样式调整
+:deep(.el-timeline) {
+  margin: 10px 0px 0px 160px;
+
+  .el-timeline-item__wrapper {
+    position: relative;
+    top: -20px;
+
+    .el-timeline-item__timestamp {
+      position: absolute !important;
+      top: 10px;
+      left: -150px;
+    }
+  }
+
+  .el-timeline-right-content {
+    display: flex;
+    align-items: center;
+    min-height: 30px;
+    padding: 10px;
+    background-color: #f7f8fa;
+
+    &::before {
+      content: ''; /* 必须设置 content 属性 */
+      position: absolute;
+      top: 10px;
+      left: 13px; /* 将伪元素水平居中 */
+      border-width: 8px; /* 调整尖角大小 */
+      border-style: solid;
+      border-color: transparent #f7f8fa transparent transparent; /* 尖角颜色，左侧朝向 */
+    }
+  }
+
+  .dot-node-style {
+    width: 20px;
+    height: 20px;
+    position: absolute;
+    left: -5px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    border-radius: 50%;
+    color: #fff;
+    font-size: 10px;
+  }
+}
 </style>

src/views/mall/trade/order/index.vue

@@ -100,17 +100,24 @@
           />
         </el-select>
       </el-form-item>
-      <!-- TODO 聚合搜索等售后结束后实现-->
+      <!-- TODO puhui 聚合搜索等售后结束后实现-->
+      <!-- TODO puhui999：尽量不要用 .k 这样的参数，完整拼写，有完整的业务含义 -->
       <el-form-item label="聚合搜索">
         <el-input
           v-show="true"
-          v-model="queryType.v"
+          v-model="queryParams[queryType.k]"
           class="!w-280px"
           clearable
           placeholder="请输入"
         >
           <template #prepend>
-            <el-select v-model="queryType.k" class="!w-110px" clearable placeholder="全部">
+            <el-select
+              v-model="queryType.k"
+              class="!w-110px"
+              clearable
+              placeholder="全部"
+              @change="inputChangeSelect"
+            >
               <el-option
                 v-for="dict in searchList"
                 :key="dict.value"
@@ -139,7 +146,7 @@
     <el-table v-loading="loading" :data="list">
       <el-table-column class-name="order-table-col">
         <template #header>
-          <!-- TODO @phui999：小屏幕下，会有偏移，后续看看 -->
+          <!-- TODO @puhui999：小屏幕下，会有偏移，后续看看 -->
           <div class="flex items-center" style="width: 100%">
             <div class="ml-100px mr-200px">商品信息</div>
             <div class="mr-60px">单价(元)/数量</div>
@@ -192,7 +199,7 @@
                 <div class="flex items-center">
                   <el-image
                     :src="row.picUrl"
-                    class="w-30px h-30px mr-10px"
+                    class="mr-10px h-30px w-30px"
                     @click="imagePreview(row.picUrl)"
                   />
                   <span class="mr-10px">{{ row.spuName }}</span>
@@ -266,8 +273,8 @@
             <el-table-column align="center" fixed="right" label="操作" width="160">
               <template #default>
                 <!-- TODO 权限后续补齐 -->
-                <div class="flex justify-center items-center">
+                <div class="flex items-center justify-center">
-                  <el-button link type="primary" @click="openForm(scope.row.id)">
+                  <el-button link type="primary" @click="openDetail(scope.row.id)">
                     <Icon icon="ep:notification" />
                     详情
                   </el-button>
@@ -335,41 +342,42 @@ const total = ref(2) // 列表的总页数
 const list = ref<TradeOrderApi.OrderVO[]>([]) // 列表的数据
 const queryFormRef = ref<FormInstance>() // 搜索的表单
 // 表单搜索
-const queryParams = reactive({
+const queryParams = ref({
-  pageNo: 1, //首页
+  pageNo: 1, // 页数
-  pageSize: 10, //页面大小
+  pageSize: 10, // 每页显示数量
-  no: '',
+  status: null, // 订单状态
-  userId: '',
+  payChannelCode: null, // 支付方式
-  userNickname: '',
+  createTime: null, // 创建时间
-  userMobile: '',
+  terminal: null, // 订单来源
-  receiverName: '',
+  type: null, // 订单类型
-  receiverMobile: '',
+  deliveryType: null, // 配送方式
-
+  logisticsId: null, // 快递公司
-  terminal: '',
+  pickUpStoreId: null // 自提门店
-  type: null,
-  status: null,
-  payChannelCode: '',
-  createTime: [],
-  deliveryType: null,
-  spuName: '',
-  itemCount: '',
-  pickUpStoreId: [],
-  logisticsId: null,
-  all: ''
 })
-const queryType = reactive({ k: '', v: '' }) // 订单搜索类型kv
+const queryType = reactive({ k: '' }) // 订单搜索类型 k
-/**
+
- * 订单聚合搜索
+// 订单聚合搜索 select 类型配置
- * 商品名称、商品件数、全部
+// TODO @puhui999：dynamicSearchList，动态搜索；其它相关的变量和方法，都可以朝着这个变量靠哈；这样更容易理解；
- *
- * 需要后端支持 TODO
- */
 const searchList = ref([
   { value: 'no', label: '订单号' },
   { value: 'userId', label: '用户UID' },
   { value: 'userNickname', label: '用户昵称' },
   { value: 'userMobile', label: '用户电话' }
 ])
+/**
+ * 聚合搜索切换查询对象时触发
+ * @param val
+ */
+const inputChangeSelect = (val: string) => {
+  searchList.value
+    .filter((item) => item.value !== val)
+    ?.forEach((item1) => {
+      // 清除集合搜索无用属性
+      if (queryParams.value.hasOwnProperty(item1.value)) {
+        delete queryParams.value[item1.value]
+      }
+    })
+}
 
 const headerStyle = ({ row, columnIndex }: any) => {
   // 表头第一行第一列占 8
@@ -417,7 +425,7 @@ const spanMethod = ({ row, rowIndex, columnIndex }: SpanMethodProps) => {
 const getList = async () => {
   loading.value = true
   try {
-    const data = await TradeOrderApi.getOrderPage(queryParams)
+    const data = await TradeOrderApi.getOrderPage(unref(queryParams))
     list.value = data.list
     total.value = data.total
   } finally {
@@ -427,13 +435,25 @@ const getList = async () => {
 
 /** 搜索按钮操作 */
 const handleQuery = async () => {
-  queryParams.pageNo = 1
+  queryParams.value.pageNo = 1
   await getList()
 }
 
 /** 重置按钮操作 */
 const resetQuery = () => {
   queryFormRef.value?.resetFields()
+  queryParams.value = {
+    pageNo: 1, // 页数
+    pageSize: 10, // 每页显示数量
+    status: null, // 订单状态
+    payChannelCode: null, // 支付方式
+    createTime: null, // 创建时间
+    terminal: null, // 订单来源
+    type: null, // 订单类型
+    deliveryType: null, // 配送方式
+    logisticsId: null, // 快递公司
+    pickUpStoreId: null // 自提门店
+  }
   handleQuery()
 }
 
@@ -445,7 +465,7 @@ const imagePreview = (imgUrl: string) => {
 }
 
 /** 查看订单详情 */
-const openForm = (id: number) => {
+const openDetail = (id: number) => {
   push({ name: 'TradeOrderDetail', params: { orderId: id } })
 }
 

src/views/member/level/index.vue

@@ -45,7 +45,7 @@
         <template #default="scope">
           <el-image
             :src="scope.row.icon"
-            class="w-30px h-30px"
+            class="h-30px w-30px"
             :preview-src-list="[scope.row.icon]"
           />
         </template>
@@ -54,7 +54,7 @@
         <template #default="scope">
           <el-image
             :src="scope.row.backgroundUrl"
-            class="w-30px h-30px"
+            class="h-30px w-30px"
             :preview-src-list="[scope.row.backgroundUrl]"
           />
         </template>

src/views/member/point/config/index.vue

@@ -10,47 +10,44 @@
       <el-form-item label="hideId" v-show="false">
         <el-input v-model="formData.id" />
       </el-form-item>
-      <el-form-item label="积分抵扣" prop="tradeDeductEnable" class="item-bottom">
+
+      <el-tabs>
+        <el-tab-pane label="积分">
+          <el-form-item label="积分抵扣" prop="tradeDeductEnable">
             <el-switch v-model="formData.tradeDeductEnable" style="user-select: none" />
+            <el-text class="w-full" size="small" type="info">下单积分是否抵用订单金额</el-text>
           </el-form-item>
-      <el-form-item>
+          <el-form-item label="积分抵扣" prop="tradeDeductUnitPrice">
-        <el-text class="mx-1" size="small" type="info">下单积分是否抵用订单金额</el-text>
-      </el-form-item>
-      <el-form-item label="积分抵扣" prop="tradeDeductUnitPrice" class="item-bottom">
             <el-input-number
               v-model="computedTradeDeductUnitPrice"
               placeholder="请输入积分抵扣金额"
-          style="width: 300px"
               :precision="2"
             />
-      </el-form-item>
+            <el-text class="w-full" size="small" type="info">
-      <el-form-item>
-        <el-text class="mx-1" size="small" type="info">
               积分抵用比例(1 积分抵多少金额)，单位：元
             </el-text>
           </el-form-item>
-      <el-form-item label="积分抵扣最大值" prop="tradeDeductMaxPrice" class="item-bottom">
+          <el-form-item label="积分抵扣最大值" prop="tradeDeductMaxPrice">
             <el-input-number
               v-model="formData.tradeDeductMaxPrice"
               placeholder="请输入积分抵扣最大值"
-          style="width: 300px"
             />
+            <el-text class="w-full" size="small" type="info">
+              单次下单积分使用上限，0 不限制
+            </el-text>
           </el-form-item>
-      <el-form-item>
+          <el-form-item label="1 元赠送多少分" prop="tradeGivePoint">
-        <el-text class="mx-1" size="small" type="info">单次下单积分使用上限，0 不限制</el-text>
-      </el-form-item>
-      <el-form-item label="1 元赠送多少分" prop="tradeGivePoint" class="item-bottom">
             <el-input-number
               v-model="formData.tradeGivePoint"
               placeholder="请输入 1 元赠送多少积分"
-          style="width: 300px"
             />
-      </el-form-item>
+            <el-text class="w-full" size="small" type="info">
-      <el-form-item>
-        <el-text class="mx-1" size="small" type="info">
               下单支付金额按比例赠送积分（实际支付 1 元赠送多少积分）
             </el-text>
           </el-form-item>
+        </el-tab-pane>
+      </el-tabs>
+
       <el-form-item>
         <el-button type="primary" @click="onSubmit">保存</el-button>
       </el-form-item>
@@ -68,6 +65,7 @@ const message = useMessage() // 消息弹窗
 const dialogVisible = ref(false) // 弹窗的是否展示
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
 const formData = ref({
+  id: undefined,
   tradeDeductEnable: true,
   tradeDeductUnitPrice: 0,
   tradeDeductMaxPrice: 0,
@@ -119,9 +117,3 @@ onMounted(() => {
   getConfig()
 })
 </script>
-
-<style scoped>
-.item-bottom {
-  margin-bottom: 0;
-}
-</style>

src/views/member/user/detail/UserExperienceRecordList.vue

@@ -0,0 +1,158 @@
+<template>
+  <ContentWrap>
+    <!-- 搜索工作栏 -->
+    <el-form
+      class="-mb-15px"
+      :model="queryParams"
+      ref="queryFormRef"
+      :inline="true"
+      label-width="68px"
+    >
+      <el-form-item label="业务类型" prop="bizType">
+        <el-select
+          v-model="queryParams.bizType"
+          placeholder="请选择业务类型"
+          clearable
+          class="!w-240px"
+        >
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.MEMBER_EXPERIENCE_BIZ_TYPE)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="标题" prop="title">
+        <el-input
+          v-model="queryParams.title"
+          placeholder="请输入标题"
+          clearable
+          @keyup.enter="handleQuery"
+          class="!w-240px"
+        />
+      </el-form-item>
+      <el-form-item label="创建时间" prop="createTime">
+        <el-date-picker
+          v-model="queryParams.createTime"
+          value-format="YYYY-MM-DD HH:mm:ss"
+          type="daterange"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+          class="!w-240px"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+      </el-form-item>
+    </el-form>
+  </ContentWrap>
+
+  <!-- 列表 -->
+  <ContentWrap>
+    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+      <el-table-column label="编号" align="center" prop="id" width="150px" />
+      <el-table-column
+        label="获得时间"
+        align="center"
+        prop="createTime"
+        :formatter="dateFormatter"
+      />
+      <el-table-column label="经验" align="center" prop="experience" width="150px">
+        <template #default="scope">
+          <el-tag v-if="scope.row.experience > 0" class="ml-2" type="success" effect="dark">
+            +{{ scope.row.experience }}
+          </el-tag>
+          <el-tag v-else class="ml-2" type="danger" effect="dark">
+            {{ scope.row.experience }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="总经验" align="center" prop="totalExperience" width="150px">
+        <template #default="scope">
+          <el-tag class="ml-2" effect="dark">
+            {{ scope.row.totalExperience }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="标题" align="center" prop="title" width="150px" />
+      <el-table-column label="描述" align="center" prop="description" />
+      <el-table-column label="业务编号" align="center" prop="bizId" width="150px" />
+      <el-table-column label="业务类型" align="center" prop="bizType" width="150px">
+        <!--   TODO 芋艿：此处应创建对应的字典 -->
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.MEMBER_EXPERIENCE_BIZ_TYPE" :value="scope.row.bizType" />
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </ContentWrap>
+</template>
+
+<script setup lang="ts">
+import { dateFormatter } from '@/utils/formatTime'
+import * as ExperienceRecordApi from '@/api/member/experience-record/index'
+import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
+
+defineOptions({ name: 'UserExperienceRecordList' })
+
+const loading = ref(true) // 列表的加载中
+const total = ref(0) // 列表的总页数
+const list = ref([]) // 列表的数据
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  userId: null,
+  bizId: null,
+  bizType: null,
+  title: null,
+  description: null,
+  experience: null,
+  totalExperience: null,
+  createTime: []
+})
+const queryFormRef = ref() // 搜索的表单
+/** 查询列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await ExperienceRecordApi.getExperienceRecordPage(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+
+const { userId } = defineProps({
+  userId: {
+    type: Number,
+    required: true
+  }
+})
+/** 初始化 **/
+onMounted(() => {
+  queryParams.userId = userId
+  getList()
+})
+</script>

src/views/member/user/detail/UserOrderList.vue

@@ -0,0 +1,403 @@
+<template>
+  <!-- 搜索 -->
+  <ContentWrap>
+    <el-form
+      ref="queryFormRef"
+      :inline="true"
+      :model="queryParams"
+      class="-mb-15px"
+      label-width="68px"
+    >
+      <el-form-item label="订单状态" prop="status">
+        <el-select v-model="queryParams.status" class="!w-280px" clearable placeholder="全部">
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.TRADE_ORDER_STATUS)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="支付方式" prop="payChannelCode">
+        <el-select
+          v-model="queryParams.payChannelCode"
+          class="!w-280px"
+          clearable
+          placeholder="全部"
+        >
+          <el-option
+            v-for="dict in getStrDictOptions(DICT_TYPE.PAY_CHANNEL_CODE)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="创建时间" prop="createTime">
+        <el-date-picker
+          v-model="queryParams.createTime"
+          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+          class="!w-280px"
+          end-placeholder="自定义时间"
+          start-placeholder="自定义时间"
+          type="daterange"
+          value-format="YYYY-MM-DD HH:mm:ss"
+        />
+      </el-form-item>
+      <el-form-item label="订单来源" prop="terminal">
+        <el-select v-model="queryParams.terminal" class="!w-280px" clearable placeholder="全部">
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.TERMINAL)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="订单类型" prop="type">
+        <el-select v-model="queryParams.type" class="!w-280px" clearable placeholder="全部">
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.TRADE_ORDER_TYPE)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="配送方式" prop="deliveryType">
+        <el-select v-model="queryParams.deliveryType" class="!w-280px" clearable placeholder="全部">
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.TRADE_DELIVERY_TYPE)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item v-if="queryParams.deliveryType === 1" label="快递公司">
+        <el-select v-model="queryParams.logisticsId" class="!w-280px" clearable placeholder="全部">
+          <el-option
+            v-for="item in deliveryExpressList"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item v-if="queryParams.deliveryType === 2" label="自提门店">
+        <el-select
+          v-model="queryParams.pickUpStoreId"
+          class="!w-280px"
+          clearable
+          multiple
+          placeholder="全部"
+        >
+          <el-option
+            v-for="item in pickUpStoreList"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          />
+        </el-select>
+      </el-form-item>
+      <!-- TODO 聚合搜索等售后结束后实现-->
+      <!--      <el-form-item label="聚合搜索">-->
+      <!--        <el-input-->
+      <!--          v-show="true"-->
+      <!--          v-model="queryType.v"-->
+      <!--          class="!w-280px"-->
+      <!--          clearable-->
+      <!--          placeholder="请输入"-->
+      <!--        >-->
+      <!--          <template #prepend>-->
+      <!--            <el-select v-model="queryType.k" class="!w-110px" clearable placeholder="全部">-->
+      <!--              <el-option-->
+      <!--                v-for="dict in searchList"-->
+      <!--                :key="dict.value"-->
+      <!--                :label="dict.label"-->
+      <!--                :value="dict.value"-->
+      <!--              />-->
+      <!--            </el-select>-->
+      <!--          </template>-->
+      <!--        </el-input>-->
+      <!--      </el-form-item>-->
+      <el-form-item>
+        <el-button @click="handleQuery">
+          <Icon class="mr-5px" icon="ep:search" />
+          搜索
+        </el-button>
+        <el-button @click="resetQuery">
+          <Icon class="mr-5px" icon="ep:refresh" />
+          重置
+        </el-button>
+      </el-form-item>
+    </el-form>
+  </ContentWrap>
+
+  <!-- 列表 -->
+  <ContentWrap>
+    <el-table v-loading="loading" :data="list">
+      <el-table-column class-name="order-table-col">
+        <template #header>
+          <!-- TODO @puhui999：小屏幕下，会有偏移，后续看看 -->
+          <div class="flex items-center" style="width: 100%">
+            <div class="ml-100px mr-200px">商品信息</div>
+            <div class="mr-60px">单价(元)/数量</div>
+            <div class="mr-60px">售后状态</div>
+            <div class="mr-60px">实付金额(元)</div>
+            <div class="mr-60px">买家/收货人</div>
+            <div class="mr-60px">配送方式</div>
+            <div class="mr-60px">订单状态</div>
+            <div class="mr-60px">操作</div>
+          </div>
+        </template>
+        <template #default="scope">
+          <el-table
+            :border="true"
+            :data="scope.row.items"
+            :header-cell-style="headerStyle"
+            :span-method="spanMethod"
+            style="width: 100%"
+          >
+            <el-table-column min-width="300" prop="spuName">
+              <template #header>
+                <div
+                  class="flex items-center"
+                  style="width: 100%; height: 35px; background-color: #f7f7f7"
+                >
+                  <span class="mr-20px">订单号：{{ scope.row.no }} </span>
+                  <span class="mr-20px">下单时间：{{ formatDate(scope.row.createTime) }}</span>
+                  <span>订单来源：</span>
+                  <dict-tag
+                    :type="DICT_TYPE.TERMINAL"
+                    :value="scope.row.terminal"
+                    class="mr-20px"
+                  />
+                  <span>支付方式：</span>
+                  <dict-tag
+                    v-if="scope.row.payChannelCode"
+                    :type="DICT_TYPE.PAY_CHANNEL_CODE"
+                    :value="scope.row.payChannelCode"
+                    class="mr-20px"
+                  />
+                  <v-else v-else class="mr-20px">未支付</v-else>
+                  <span v-if="scope.row.payTime" class="mr-20px">
+                    支付时间：{{ formatDate(scope.row.payTime) }}
+                  </span>
+                  <span>订单类型：</span>
+                  <dict-tag :type="DICT_TYPE.TRADE_ORDER_TYPE" :value="scope.row.type" />
+                </div>
+              </template>
+              <template #default="{ row }">
+                <div class="flex items-center">
+                  <el-image
+                    :src="row.picUrl"
+                    class="w-30px h-30px mr-10px"
+                    @click="imagePreview(row.picUrl)"
+                  />
+                  <span class="mr-10px">{{ row.spuName }}</span>
+                  <el-tag
+                    v-for="property in row.properties"
+                    :key="property.propertyId"
+                    class="mr-10px"
+                  >
+                    {{ property.propertyName }}: {{ property.valueName }}
+                  </el-tag>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column label="商品原价*数量" prop="price" width="150">
+              <template #default="{ row }">
+                {{ floatToFixed2(row.price) }} 元 / {{ row.count }}
+              </template>
+            </el-table-column>
+            <el-table-column label="售后状态" prop="afterSaleStatus" width="120">
+              <template #default="{ row }">
+                <dict-tag
+                  :type="DICT_TYPE.TRADE_ORDER_ITEM_AFTER_SALE_STATUS"
+                  :value="row.afterSaleStatus"
+                />
+              </template>
+            </el-table-column>
+            <el-table-column align="center" label="实际支付" min-width="120" prop="payPrice">
+              <template #default>
+                {{ floatToFixed2(scope.row.payPrice) + '元' }}
+              </template>
+            </el-table-column>
+            <el-table-column label="买家/收货人" min-width="160">
+              <template #default>
+                <!-- 快递发货  -->
+                <div v-if="scope.row.deliveryType === 1" class="flex flex-col">
+                  <span>买家：{{ scope.row.user.nickname }}</span>
+                  <span>
+                    收货人：{{ scope.row.receiverName }} {{ scope.row.receiverMobile }}
+                    {{ scope.row.receiverAreaName }} {{ scope.row.receiverDetailAddress }}
+                  </span>
+                </div>
+                <!-- 自提  -->
+                <div v-if="scope.row.deliveryType === 2" class="flex flex-col">
+                  <span>
+                    门店名称：
+                    {{ pickUpStoreList.find((p) => p.id === scope.row.pickUpStoreId)?.name }}
+                  </span>
+                  <span>
+                    门店手机：
+                    {{ pickUpStoreList.find((p) => p.id === scope.row.pickUpStoreId)?.phone }}
+                  </span>
+                  <span>
+                    自提门店:
+                    {{
+                      pickUpStoreList.find((p) => p.id === scope.row.pickUpStoreId)?.detailAddress
+                    }}
+                  </span>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column align="center" label="配送方式" width="120">
+              <template #default>
+                <dict-tag :type="DICT_TYPE.TRADE_DELIVERY_TYPE" :value="scope.row.deliveryType" />
+              </template>
+            </el-table-column>
+            <el-table-column align="center" label="订单状态" width="120">
+              <template #default>
+                <dict-tag :type="DICT_TYPE.TRADE_ORDER_STATUS" :value="scope.row.status" />
+              </template>
+            </el-table-column>
+            <el-table-column align="center" fixed="right" label="操作" width="160">
+              <template #default>
+                <el-button link type="primary" @click="openDetail(scope.row.id)">
+                  <Icon icon="ep:notification" />
+                  详情
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      v-model:limit="queryParams.pageSize"
+      v-model:page="queryParams.pageNo"
+      :total="total"
+      @pagination="getList"
+    />
+  </ContentWrap>
+</template>
+<script setup lang="ts">
+import * as OrderApi from '@/api/mall/trade/order/index'
+import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
+import { formatDate } from '@/utils/formatTime'
+import { floatToFixed2 } from '@/utils'
+import * as PickUpStoreApi from '@/api/mall/trade/delivery/pickUpStore'
+import * as DeliveryExpressApi from '@/api/mall/trade/delivery/express'
+import { createImageViewer } from '@/components/ImageViewer'
+import * as TradeOrderApi from '@/api/mall/trade/order'
+import { FormInstance, TableColumnCtx } from 'element-plus'
+
+const { push } = useRouter() // 路由跳转
+
+const { userId }: { userId: number } = defineProps({
+  userId: {
+    type: Number,
+    required: true
+  }
+})
+const loading = ref(true) // 列表的加载中
+const total = ref(0) // 列表的总页数
+const list = ref([]) // 列表的数据
+const pickUpStoreList = ref([]) // 自提门店精简列表
+const deliveryExpressList = ref([]) // 物流公司
+const queryFormRef = ref<FormInstance>() // 搜索的表单
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  createDate: [],
+  userId: NaN
+})
+const headerStyle = ({ row, columnIndex }: any) => {
+  // 表头第一行第一列占 8
+  if (columnIndex === 0) {
+    row[columnIndex].colSpan = 8
+  } else {
+    // 其余的不要
+    row[columnIndex].colSpan = 0
+    return {
+      display: 'none'
+    }
+  }
+}
+/** 搜索按钮操作 */
+const handleQuery = async () => {
+  queryParams.pageNo = 1
+  await getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value?.resetFields()
+  handleQuery()
+}
+/** 查询列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await OrderApi.getOrderPage(queryParams)
+    console.log(data)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 商品图预览 */
+const imagePreview = (imgUrl: string) => {
+  createImageViewer({
+    urlList: [imgUrl]
+  })
+}
+
+interface SpanMethodProps {
+  row: TradeOrderApi.OrderItemRespVO
+  column: TableColumnCtx<TradeOrderApi.OrderItemRespVO>
+  rowIndex: number
+  columnIndex: number
+}
+
+const spanMethod = ({ row, rowIndex, columnIndex }: SpanMethodProps) => {
+  const len = list.value.find(
+    (order) => order.items?.findIndex((item) => item.id === row.id) !== -1
+  )?.items?.length
+  // 要合并的列，从零开始
+  const colIndex = [3, 4, 5, 6, 7]
+  if (colIndex.includes(columnIndex)) {
+    // 除了第一行其余的不要
+    if (rowIndex !== 0) {
+      return {
+        rowspan: 0,
+        colspan: 0
+      }
+    }
+    // 动态合并行
+    return {
+      rowspan: len,
+      colspan: 1
+    }
+  }
+}
+
+/** 查看订单详情 */
+const openDetail = (id: number) => {
+  push({ name: 'TradeOrderDetail', params: { orderId: id } })
+}
+
+/** 初始化 **/
+onMounted(async () => {
+  queryParams.userId = userId
+  await getList()
+  pickUpStoreList.value = await PickUpStoreApi.getListAllSimple()
+  deliveryExpressList.value = await DeliveryExpressApi.getSimpleDeliveryExpressList()
+})
+</script>
+<style scoped lang="scss"></style>

src/views/member/user/detail/index.vue

@@ -36,12 +36,16 @@
           <el-tab-pane label="签到" name="sign" lazy>
             <UserSignList :user-id="id" />
           </el-tab-pane>
-          <el-tab-pane label="成长值" name="third">成长值(WIP)</el-tab-pane>
+          <el-tab-pane label="成长值" name="experience" lazy>
+            <UserExperienceRecordList :user-id="id"
+            /></el-tab-pane>
           <el-tab-pane label="余额" name="fourth">余额(WIP)</el-tab-pane>
           <el-tab-pane label="收货地址" name="address" lazy>
             <UserAddressList :user-id="id" />
           </el-tab-pane>
-          <el-tab-pane label="订单管理" name="fourth">订单管理(WIP)</el-tab-pane>
+          <el-tab-pane label="订单管理" name="order" lazy>
+            <UserOrderList :user-id="id" />
+          </el-tab-pane>
           <el-tab-pane label="售后管理" name="fourth">售后管理(WIP)</el-tab-pane>
           <el-tab-pane label="收藏记录" name="fourth">收藏记录(WIP)</el-tab-pane>
           <el-tab-pane label="优惠劵" name="fourth">优惠劵(WIP)</el-tab-pane>
@@ -62,14 +66,16 @@ import UserAccountInfo from './UserAccountInfo.vue'
 import UserAddressList from './UserAddressList.vue'
 import UserPointList from './UserPointList.vue'
 import UserSignList from './UserSignList.vue'
+import UserExperienceRecordList from './UserExperienceRecordList.vue'
 import { CardTitle } from '@/components/Card/index'
+import UserOrderList from '@/views/member/user/detail/UserOrderList.vue'
 import { ElMessage } from 'element-plus'
 
 defineOptions({ name: 'MemberDetail' })
 
 const activeName = ref('point') // 账户明细 选中的 tabs
 const loading = ref(true) // 加载中
-const user = ref<UserApi.UserVO>()
+const user = ref<UserApi.UserVO>({})
 
 /** 添加/修改操作 */
 const formRef = ref()

src/views/member/user/index.vue

@@ -160,6 +160,7 @@
 import { dateFormatter } from '@/utils/formatTime'
 import * as UserApi from '@/api/member/user'
 import { DICT_TYPE } from '@/utils/dict'
+import UserForm from './UserForm.vue'
 import MemberTagSelect from '@/views/member/tag/components/MemberTagSelect.vue'
 import MemberLevelSelect from '@/views/member/level/components/MemberLevelSelect.vue'
 import MemberGroupSelect from '@/views/member/group/components/MemberGroupSelect.vue'
@@ -218,6 +219,12 @@ const openDetail = (id: number) => {
   push({ name: 'MemberUserDetail', params: { id } })
 }
 
+/** 添加/修改操作 */
+const formRef = ref()
+const openForm = (type: string, id?: number) => {
+  formRef.value.open(type, id)
+}
+
 /** 表格选中事件 */
 const handleSelectionChange = (rows: UserApi.UserVO[]) => {
   selectedIds.value = rows.map((row) => row.id)

src/views/mp/components/wx-video-play/main.vue

@@ -26,8 +26,8 @@
         :src="props.url"
         poster=""
         crossorigin="anonymous"
-        playsinline
         controls
+        playsinline
         :volume="0.6"
         :width="800"
         :playback-rates="[0.7, 1.0, 1.5, 2.0]"

src/views/mp/menu/components/MenuPreviewer.vue

@@ -26,7 +26,7 @@
             @end="onChildDragEnd"
           >
             <template #item="{ element: child, index: y }">
-              <div class="subtitle menu_bottom">
+              <div class="menu_bottom subtitle">
                 <div
                   class="menu_subItem"
                   v-if="parent.children"

src/views/mp/menu/index.vue

@@ -9,13 +9,13 @@
   </ContentWrap>
 
   <ContentWrap>
-    <div class="public-account-management clearfix" v-loading="loading">
+    <div class="clearfix public-account-management" v-loading="loading">
       <!--左边配置菜单-->
       <div class="left">
         <div class="weixin-hd">
           <div class="weixin-title">{{ accountName }}</div>
         </div>
-        <div class="weixin-menu clearfix">
+        <div class="clearfix weixin-menu">
           <MenuPreviewer
             v-model="menuList"
             :account-id="accountId"