From 63b22f4c86aae1d5509bc57295e4bb6c5cd37030 Mon Sep 17 00:00:00 2001
From: "pikachu1995@126.com" <pikachu1995@126.com>
Date: Mon, 16 Oct 2023 16:00:15 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E5=88=86=E9=94=80=E7=BB=93=E6=9E=84?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 buyer/src/api/distribution.js                 | 110 +++++
 buyer/src/api/member.js                       |  85 ----
 .../pages/home/memberCenter/Distribution.vue  | 438 ++++++++++--------
 manager/src/api/distribution.js               |  11 +-
 manager/src/router/router.js                  |  14 +-
 .../src/views/distribution/distribution.vue   |  67 ++-
 .../views/distribution/distributionGoods.vue  |   5 -
 .../views/distribution/distributionGroup.vue  | 103 ++++
 .../views/distribution/distributionMember.vue | 114 +++++
 .../views/distribution/distributionOrder.vue  |   4 +-
 .../distribution/distributionSetting.vue      | 154 +++++-
 seller/src/api/distribution.js                |  63 +--
 .../distribution/distributionSetting.vue      |  96 ++++
 13 files changed, 891 insertions(+), 373 deletions(-)
 create mode 100644 buyer/src/api/distribution.js
 create mode 100644 manager/src/views/distribution/distributionGroup.vue
 create mode 100644 manager/src/views/distribution/distributionMember.vue
 create mode 100644 seller/src/views/distribution/distributionSetting.vue

diff --git a/buyer/src/api/distribution.js b/buyer/src/api/distribution.js
new file mode 100644
index 00000000..34e4f379
--- /dev/null
+++ b/buyer/src/api/distribution.js
@@ -0,0 +1,110 @@
+import request, {Method} from '@/plugins/request.js';
+
+/**
+ * 获取当前会员分销信息
+ */
+export function distribution () {
+  return request({
+    url: `/buyer/distribution/distribution`,
+    method: Method.GET,
+    needToken: true
+  });
+}
+
+/**
+ * 申请成为分销员
+ * @param idNumber 身份证号
+ * @param name  名字
+ */
+export function applyDistribution (params) {
+  return request({
+    url: `/buyer/distribution/distribution`,
+    method: Method.POST,
+    needToken: true,
+    params
+  });
+}
+
+/**
+ * 获取分销员订单列表
+ */
+export function getDistOrderList (params) {
+  return request({
+    url: `/buyer/distribution/order`,
+    method: Method.GET,
+    needToken: true,
+    params
+  });
+}
+
+/**
+ * 获取分销员下级用户列表
+ */
+export function getDistMemberList (params) {
+  return request({
+    url: `/buyer/distribution/distribution/memberList`,
+    method: Method.GET,
+    needToken: true,
+    params
+  });
+}
+
+/**
+ * 获取分销商商品列表
+ */
+export function getDistGoodsList (params) {
+  return request({
+    url: `/buyer/distribution/goods`,
+    method: Method.GET,
+    needToken: true,
+    params
+  });
+}
+
+/**
+ * 分销员提现历史
+ */
+export function distCashHistory (params) {
+  return request({
+    url: `/buyer/distribution/cash`,
+    method: Method.GET,
+    needToken: true,
+    params
+  });
+}
+
+/**
+ * 分销员-团队列表
+ */
+export function getDistGroupList (params) {
+  return request({
+    url: `/buyer/distribution/distribution/groupList`,
+    method: Method.GET,
+    needToken: true,
+    params
+  });
+}
+
+/**
+ * 分销商提现
+ */
+export function distCash (params) {
+  return request({
+    url: `/buyer/distribution/cash`,
+    method: Method.POST,
+    needToken: true,
+    params
+  });
+}
+
+/**
+ * 绑定分销
+ * @param distributionId 商品分销ID
+ */
+export function getGoodsDistribution (distributionId) {
+  return request({
+    url: `/buyer/distribution/distribution/bindingDistribution/${distributionId}`,
+    method: Method.GET,
+    needToken: true
+  });
+}
diff --git a/buyer/src/api/member.js b/buyer/src/api/member.js
index eeb7de21..ed2da4bc 100644
--- a/buyer/src/api/member.js
+++ b/buyer/src/api/member.js
@@ -333,92 +333,7 @@ export function clearComplain (id) {
   });
 }
 
-/**
- * 获取当前会员分销信息
- */
-export function distribution () {
-  return request({
-    url: `/buyer/distribution/distribution`,
-    method: Method.GET,
-    needToken: true
-  });
-}
 
-/**
- * 申请成为分销商
- * @param idNumber 身份证号
- * @param name  名字
- */
-export function applyDistribution (params) {
-  return request({
-    url: `/buyer/distribution/distribution`,
-    method: Method.POST,
-    needToken: true,
-    params
-  });
-}
-
-/**
- * 获取分销商订单列表
- */
-export function getDistOrderList (params) {
-  return request({
-    url: `/buyer/distribution/order`,
-    method: Method.GET,
-    needToken: true,
-    params
-  });
-}
-
-/**
- * 获取分销商商品列表
- */
-export function getDistGoodsList (params) {
-  return request({
-    url: `/buyer/distribution/goods`,
-    method: Method.GET,
-    needToken: true,
-    params
-  });
-}
-
-/**
- * 绑定、解绑分销商品
- * @param distributionGoodsId 分销商品id
- * @param checked 分销商品id,true为绑定，false为解绑
- */
-export function selectDistGoods (params) {
-  return request({
-    url: `/buyer/distribution/goods/checked/${params.distributionGoodsId}`,
-    method: Method.GET,
-    needToken: true,
-    params
-  });
-}
-
-/**
- * 分销商提现历史
- */
-export function distCashHistory (params) {
-  return request({
-    url: `/buyer/distribution/cash`,
-    method: Method.GET,
-    needToken: true,
-    params
-  });
-}
-
-/**
- * 分销商提现
- */
-export function distCash (params) {
-  return request({
-    url: `/buyer/distribution/cash`,
-    method: Method.POST,
-    needToken: true,
-    params
-  });
-}
 
 /**
  * 我的足迹
diff --git a/buyer/src/pages/home/memberCenter/Distribution.vue b/buyer/src/pages/home/memberCenter/Distribution.vue
index 1933950c..33aa7526 100644
--- a/buyer/src/pages/home/memberCenter/Distribution.vue
+++ b/buyer/src/pages/home/memberCenter/Distribution.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="wrapper">
-    <card _Title="我的分销" />
+    <card _Title="我的分销"/>
     <!-- 分销申请 -->
 
     <div v-if="status === 0">
@@ -12,20 +12,8 @@
         <FormItem label="身份证号" prop="idNumber">
           <Input v-model="applyForm.idNumber"></Input>
         </FormItem>
-        <FormItem label="银行开户行" prop="settlementBankBranchName">
-          <Input v-model="applyForm.settlementBankBranchName"></Input>
-        </FormItem>
-        <FormItem label="银行开户名" prop="settlementBankAccountName">
-          <Input v-model="applyForm.settlementBankAccountName"></Input>
-        </FormItem>
-        <FormItem label="银行账号" prop="settlementBankAccountNum">
-          <Input v-model="applyForm.settlementBankAccountNum"></Input>
-        </FormItem>
-
         <FormItem>
-          <Button type="primary" :loading="applyLoading" @click="apply"
-          >提交申请</Button
-          >
+          <Button type="primary" :loading="applyLoading" @click="apply">提交申请</Button>
         </FormItem>
       </Form>
     </div>
@@ -34,43 +22,69 @@
       <Alert type="success">
         您提交的信息正在审核
         <template slot="desc"
-        >提交认证申请后，工作人员将在三个工作日进行核对完成审核</template
+        >提交认证申请后，工作人员将在三个工作日进行核对完成审核
+        </template
         >
       </Alert>
     </div>
     <!-- 分销提现、商品、订单 -->
     <div v-if="status === 2">
       <div class="tips">
-
         <p>分销下线付款之后会生成分销订单。</p>
-        <p>
-          冻结金额：用户提现金额即为冻结金额，审核通过后扣除冻结金额，审核拒绝之后冻结金额返回可提现金额。
-        </p>
-        <p>可提现金额：分销订单佣金T+1解冻后可变为可提现金额。</p>
-
+        <p>交易完成后返佣可提现。</p>
       </div>
 
       <div class="box">
         <div class="mb_20 account-price">
-          <span class="subTips">可提现金额：</span>
-          <span class="fontsize_48 global_color"
-          >￥{{ result.canRebate | unitPrice }}</span
-          >
-          <span class="subTips">冻结金额：</span>
-          <span class="">￥{{ result.commissionFrozen | unitPrice }}</span>
-          <span class="subTips">返利总金额：</span>
-          <span class="">￥{{ result.rebateTotal | unitPrice }}</span>
+          <span class="subTips">可提现金额(元)：</span>
+          <span class="fontsize_48 global_color">{{ result.canRebate | unitPrice }}</span>
+          <span class="subTips">待结算：</span>
+          <span class="">{{ result.commissionFrozen | unitPrice }}</span>
+          <span class="subTips">总收益(元)：</span>
+          <span class="">{{ result.rebateTotal | unitPrice }}</span>
           <Button
             type="primary"
             size="small"
             class="ml_20"
-            @click="withdrawApplyModal = true"
-          >申请提现</Button
-          >
+            @click="withdrawApplyModal = true">申请提现
+          </Button>
         </div>
       </div>
       <Tabs :value="tabName" @on-click="tabPaneChange">
-        <TabPane label="已选商品" name="goodsChecked">
+        <TabPane label="推广订单" name="order">
+          <Table stripe :columns="orderColumns" :data="orderData.records">
+            <template slot-scope="{ row }" slot="createTime">
+              <span>{{ row.createTime }}</span>
+            </template>
+            <template slot-scope="{ row }" slot="goodsName">
+              <span>{{ row.goodsName }}</span>
+            </template>
+            <template slot-scope="{ row }" slot="num">
+              <span>{{ row.num }}</span>
+            </template>
+            <template slot-scope="{ row }" slot="rebate">
+              <span>{{ row.rebate }}</span>
+            </template>
+            <template slot-scope="{ row }" slot="distributionOrderStatus">
+              <span v-if="row.distributionOrderStatus == 'NO_COMPLETED'">未完成</span>
+              <span v-else-if="row.distributionOrderStatus == 'COMPLETE'">订单完成</span>
+              <span v-else-if="row.distributionOrderStatus == 'CANCEL'">订单取消</span>
+              <span v-else-if="row.distributionOrderStatus == 'REFUND'">订单退款</span>
+            </template>
+          </Table>
+          <div class="page-size">
+            <Page
+              :current="orderParams.pageNumber"
+              :total="orderData.total"
+              :page-size="orderParams.pageSize"
+              @on-change="changeOrderPage"
+              size="small"
+              show-total
+              show-elevator
+            ></Page>
+          </div>
+        </TabPane>
+        <TabPane label="推广商品" name="goods">
           <Table stripe :columns="goodsColumns" :data="goodsData.records">
             <template slot-scope="{ row }" slot="name">
               <div
@@ -79,20 +93,21 @@
                   linkTo(
                     `/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}`
                   )
-                "
-              >
+                ">
                 <img
                   style="vertical-align: top"
                   :src="row.thumbnail"
                   width="60"
                   height="60"
-                  alt=""
-                />&nbsp; {{ row.goodsName }}
+                  alt=""/>&nbsp; {{ row.goodsName }}
               </div>
             </template>
             <template slot-scope="{ row }" slot="price">
               <span> ￥{{ row.price | unitPrice }}</span>
             </template>
+            <template slot-scope="{ row }" slot="firstProportion">
+              <span style="margin-left: 10px;"> {{ row.firstProportion }}%</span>
+            </template>
             <template slot-scope="{ row }" slot="commission">
               <span> ￥{{ row.commission | unitPrice }}</span>
             </template>
@@ -101,15 +116,8 @@
                 type="success"
                 size="small"
                 style="margin-right: 5px"
-                @click="fenxiao(row)"
-              >分销商品</Button
-              >
-              <Button
-                type="error"
-                size="small"
-                @click="selectGoods(row.id, false)"
-              >取消选择</Button
-              >
+                @click="fenxiao(row)">邀请好友
+              </Button>
             </template>
           </Table>
           <div class="page-size">
@@ -124,48 +132,30 @@
             ></Page>
           </div>
         </TabPane>
-        <TabPane label="未选商品" name="goodsUncheck">
-          <Table stripe :columns="goodsColumns" :data="goodsData.records">
-            <template slot-scope="{ row }" slot="name">
-              <div
-                class="goods-msg"
-                @click="
-                  linkTo(
-                    `/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}`
-                  )
-                "
-              >
-                <img
-                  style="vertical-align: top"
-                  :src="row.thumbnail"
-                  width="60"
-                  height="60"
-                  alt=""
-                />&nbsp; {{ row.goodsName }}
-              </div>
+        <TabPane label="我的客户" name="member">
+          <Table stripe :columns="memberColumns" :data="memberData.records">
+            <template slot-scope="{ row }" slot="nickName">
+              <span>{{ row.nickName }}</span>
             </template>
-            <template slot-scope="{ row }" slot="price">
-              <span> ￥{{ row.price | unitPrice }}</span>
+            <template slot-scope="{ row }" slot="orderPrice">
+              <span>{{ row.orderPrice }}</span>
             </template>
-            <template slot-scope="{ row }" slot="commission">
-              <span> ￥{{ row.commission | unitPrice }}</span>
+            <template slot-scope="{ row }" slot="rebatePrice">
+              <span>{{ row.rebatePrice }}</span>
             </template>
-            <template slot-scope="{ row }" slot="action">
-              <Button
-                type="primary"
-                size="small"
-                style="margin-right: 5px"
-                @click="selectGoods(row.id, true)"
-              >选择商品</Button
-              >
+            <template slot-scope="{ row }" slot="orderNum">
+              <span>{{ row.orderNum }}</span>
+            </template>
+            <template slot-scope="{ row }" slot="lastLoginDate">
+              <span>{{ row.lastLoginDate }}</span>
             </template>
           </Table>
           <div class="page-size">
             <Page
-              :current="params.pageNumber"
-              :total="goodsData.total"
-              :page-size="params.pageSize"
-              @on-change="changePage"
+              :current="memberParams.pageNumber"
+              :total="memberData.total"
+              :page-size="memberParams.pageSize"
+              @on-change="changeOrderPage"
               size="small"
               show-total
               show-elevator
@@ -183,13 +173,11 @@
             <template slot-scope="{ row }" slot="price">
               <span
                 v-if="row.distributionCashStatus == 'VIA_AUDITING'"
-                style="color: green"
-              >
-                +￥{{ row.price | unitPrice }}</span
+                style="color: green">
+                ￥{{ row.price | unitPrice }}</span
               >
               <span v-else style="color: red">
-                -￥{{ row.price | unitPrice }}</span
-              >
+                ￥{{ row.price | unitPrice }}</span>
             </template>
             <template slot-scope="{ row }" slot="status">
               <span>
@@ -199,8 +187,7 @@
                     : row.distributionCashStatus == "VIA_AUDITING"
                       ? "通过"
                       : "拒绝"
-                }}</span
-              >
+                }}</span>
             </template>
           </Table>
           <div class="page-size">
@@ -215,6 +202,30 @@
             ></Page>
           </div>
         </TabPane>
+        <TabPane label="我的团队" name="group">
+          <Table stripe :columns="groupColumns" :data="groupData.records">
+            <template slot-scope="{ row }" slot="memberName">
+              <span>{{ row.memberName }}</span>
+            </template>
+            <template slot-scope="{ row }" slot="distributionOrderPrice">
+              <span>{{ row.distributionOrderPrice }}</span>
+            </template>
+            <template slot-scope="{ row }" slot="distributionOrderCount">
+              <span>{{ row.distributionOrderCount }}</span>
+            </template>
+          </Table>
+          <div class="page-size">
+            <Page
+              :current="groupParams.pageNumber"
+              :total="groupData.total"
+              :page-size="groupParams.pageSize"
+              @on-change="changeOrderPage"
+              size="small"
+              show-total
+              show-elevator
+            ></Page>
+          </div>
+        </TabPane>
       </Tabs>
     </div>
     <!-- 未开放 -->
@@ -222,7 +233,8 @@
       <Alert type="error">
         分销功能暂未开启
         <template slot="desc"
-        >提交认证申请后，工作人员将在三个工作日进行核对完成审核</template
+        >提交认证申请后，工作人员将在三个工作日进行核对完成审核
+        </template
         >
       </Alert>
     </div>
@@ -239,7 +251,8 @@
       <Alert type="success">
         您提交的申诉正在审核
         <template slot="desc"
-        >提交认证申请后，工作人员将在三个工作日进行核对完成审核</template
+        >提交认证申请后，工作人员将在三个工作日进行核对完成审核
+        </template
         >
       </Alert>
     </div>
@@ -250,29 +263,18 @@
       </p>
       <div>
         <Input v-model="withdrawPrice" size="large" number maxlength="9"
-        ><span slot="append">元</span></Input
-        >
+        ><span slot="append">元</span></Input>
       </div>
       <div slot="footer" style="text-align: center">
         <Button type="primary" size="large" @click="withdraw">提现</Button>
       </div>
     </Modal>
     <Modal v-model="qrcodeShow" title="分销商品" width="800">
-      <Alert type="warning"> 下载二维码或者复制链接分享商品 </Alert>
+      <Alert type="warning"> 下载二维码或者复制链接分享商品</Alert>
       <div class="qrcode">
-        <div style="width: 150px; height: 150px; border: 1px solid #eee">
-          <vue-qr
-            :text="qrcode"
-            :callback="qrcodeData"
-            :margin="0"
-            colorDark="#000"
-            colorLight="#fff"
-            :size="150"
-          ></vue-qr>
-          <div class="qrcode-platform">PC端</div>
-          <Button class="download-btn" type="success" @click="downloadQrcode"
-          >下载二维码</Button
-          >
+        <div style="width: 150px; height: 150px; ">
+          <div class="qrcode-platform" style="margin-top: 100px">PC端</div>
+          <Button style="margin-left: 40px; margin-top: 65px" type="success" @click="copyUrlLink">复制链接</Button>
         </div>
         <div style="width: 150px; height: 150px; border: 1px solid #eee">
           <vue-qr
@@ -285,13 +287,13 @@
           ></vue-qr>
           <div class="qrcode-platform">移动应用端</div>
           <Button class="download-btn" type="success" @click="downloadQrcodeH5"
-          >下载二维码</Button
+          >下载二维码
+          </Button
           >
         </div>
       </div>
 
       <div class="mt_10" style="margin-top: 100px;">
-        商品链接：<Input style="width: 600px" v-model="qrcode"></Input>
       </div>
     </Modal>
   </div>
@@ -304,92 +306,98 @@ import {
   distCash,
   distCashHistory,
   getDistGoodsList,
-  selectDistGoods,
-} from "@/api/member.js";
-import { IDCard } from "@/plugins/RegExp.js";
-import { checkBankno } from "@/plugins/Foundation";
+  getDistOrderList,
+  getDistMemberList,
+  getDistGroupList
+} from "@/api/distribution.js";
+import {IDCard} from "@/plugins/RegExp.js";
 import vueQr from "vue-qr";
+
 export default {
   name: "Distribution",
-  components: { vueQr },
+  components: {vueQr},
   data() {
     return {
-      config:require('@/config'),
+      config: require('@/config'),
       status: 0, // 申请状态，0为未申请 1 申请中 2 申请完成 3 功能暂未开启
       applyForm: {}, // 申请表单
       rules: {
         // 验证规则
-        name: [{ required: true, message: "请输入真实姓名" }],
+        name: [{required: true, message: "请输入真实姓名"}],
         idNumber: [
-          { required: true, message: "请输入身份证号" },
-          { pattern: IDCard, message: "请输入正确的身份证号" },
-        ],
-        settlementBankBranchName: [
-          {
-            required: true,
-            message: "请输入银行开户行",
-            // 可以单个或者同时写两个触发验证方式
-            trigger: "blur",
-          },
-        ],
-        settlementBankAccountName: [
-          {
-            required: true,
-            message: "请输入银行开户名",
-            // 可以单个或者同时写两个触发验证方式
-            trigger: "blur",
-          },
-        ],
-        //银行账号
-        settlementBankAccountNum: [
-          {
-            required: true,
-            message: "银行账号不正确",
-            // 可以单个或者同时写两个触发验证方式
-            trigger: "blur",
-          },
-          {
-            validator: (rule, value, callback) => {
-              // 上面有说，返回true表示校验通过，返回false表示不通过
-              // this.$u.test.mobile()就是返回true或者false的
-              return checkBankno(value);
-            },
-            message: "银行账号不正确",
-          },
+          {required: true, message: "请输入身份证号"},
+          {pattern: IDCard, message: "请输入正确的身份证号"},
         ],
       },
-      tabName: "goodsChecked", // 当前所在tab
+      tabName: "order", // 当前所在tab
       result: {}, // 审核结果
       applyLoading: false, // 申请加载状态
       goodsLoading: false, // 列表加载状态
+      orderLoading: false, // 订单加载状态
       withdrawApplyModal: false, // 提现表单显隐
       withdrawPrice: 0, // 提现金额
       goodsData: {}, // 商品数据
+      orderData:{}, //订单数据
+      memberData:{}, //订单数据
       logData: {}, // 日志数据
+      groupData:{},//团队数据
+      orderColumns:[
+        //订单表头
+        {title: "下单时间", slot: "createTime", minWidth: 200},
+        {title: "商品名称", slot: "goodsName", minWidth: 200},
+        {title: "数量", slot: "num"},
+        {title: "佣金金额", slot: "rebate"},
+        {title: "状态", slot: "distributionOrderStatus"},
+      ],
+      memberColumns:[
+        //客户列表表头
+        {title: "客户昵称", slot: "nickName", minWidth: 150},
+        {title: "成交额", slot: "orderPrice"},
+        {title: "佣金总额", slot: "rebatePrice"},
+        {title: "订单数", slot: "orderNum"},
+        {title: "最近下单时间", slot: "lastLoginDate", minWidth: 150},
+      ],
       goodsColumns: [
         // 商品表头
-        { title: "商品名称", slot: "name", width: 400 },
-        { title: "商品价格", slot: "price" },
-        { title: "佣金", slot: "commission" },
-        { title: "操作", slot: "action", minWidth: 120 },
+        {title: "商品名称", slot: "name", width: 400},
+        {title: "商品价格", slot: "price"},
+        {title: "佣金比例", slot: "firstProportion"},
+        {title: "预计赚", slot: "commission"},
+        {title: "操作", slot: "action", minWidth: 120},
       ],
       logColumns: [
         // 日志表头
-        { title: "编号", slot: "sn" },
-        { title: "申请时间", slot: "time" },
-        { title: "提现金额", slot: "price" },
-        { title: "提现状态", slot: "status" },
+        {title: "编号", slot: "sn"},
+        {title: "申请时间", slot: "time"},
+        {title: "提现金额", slot: "price"},
+        {title: "提现状态", slot: "status"},
+      ],
+      groupColumns: [
+        // 团队表头
+        {title: "昵称", slot: "memberName"},
+        {title: "销售额", slot: "distributionOrderPrice"},
+        {title: "订单量", slot: "distributionOrderCount"},
       ],
       params: {
         // 商品请求参数
         pageNumber: 1,
         pageSize: 20,
-        checked: true,
+        sort: "createTime",
+        order: "desc",
       },
       orderParams: {
         // 订单商品请求参数
         pageNumber: 1,
         pageSize: 20,
+        sort: "createTime",
+        order: "desc",
+      },
+      memberParams: {
+        // 会员请求参数
+        pageNumber: 1,
+        pageSize: 20,
+        sort: "createTime",
+        order: "desc",
       },
       logParams: {
         // 日志参数
@@ -398,8 +406,15 @@ export default {
         sort: "createTime",
         order: "desc",
       },
+      groupParams: {
+        // 会员请求参数
+        pageNumber: 1,
+        pageSize: 20,
+        sort: "createTime",
+        order: "desc",
+      },
       qrcode: "", // 二维码
-      qrcodeH5:"",//H5二维码
+      qrcodeH5: "",//H5二维码
       qrcodeShow: false, // 显示二维码
       base64Img: "", // base64编码
       base64ImgH5: "", // base64H5编码
@@ -427,7 +442,7 @@ export default {
     },
     withdraw() {
       // 申请提现
-      distCash({ price: this.withdrawPrice }).then((res) => {
+      distCash({price: this.withdrawPrice}).then((res) => {
         this.withdrawApplyModal = false;
         this.price = 0;
         if (res.success) {
@@ -447,6 +462,15 @@ export default {
       // 二维码H5端base64地址
       this.base64ImgH5 = data64;
     },
+    copyUrlLink(){
+      navigator.clipboard.writeText(this.qrcode)
+        .then(() => {
+          this.$Message.success("复制成功！");
+        })
+        .catch(err => {
+          this.$Message.error("复制失败！");
+        });
+    },
     downloadQrcode() {
       // 下载二维码
       let a = document.createElement("a"); // 生成一个a元素
@@ -455,7 +479,7 @@ export default {
       a.href = this.base64Img; // 将生成的URL设置为a.href属性
       a.dispatchEvent(event); // 触发a的单击事件
     },
-    downloadQrcodeH5(){
+    downloadQrcodeH5() {
       // 下载H5二维码
       let a = document.createElement("a"); // 生成一个a元素
       let event = new MouseEvent("click"); // 创建一个单击事件
@@ -465,18 +489,33 @@ export default {
     },
     tabPaneChange(tab) {
       // tab栏切换
-      if (tab === "goodsChecked") {
-        this.params.checked = true;
-        this.params.pageNUmber = 1;
-        this.getGoodsData();
-      } else if (tab === "goodsUncheck") {
+      if (tab === "goods") {
         this.params.checked = false;
         this.getGoodsData();
+      }else if (tab === "order") {
+        this.orderParams.checked = false;
+        this.getOrderData();
+      }else if (tab === "member") {
+        this.memberParams.checked = false;
+        this.getMemberData();
       } else if (tab === "log") {
         this.logParams.pageNumber = 1;
         this.getLog();
+      }else if (tab === "group") {
+        this.groupParams.pageNumber = 1;
+        this.getGroupData();
       }
     },
+    changeOrderPage(val) {
+      // 修改页码
+      this.orderParams.pageNumber = val;
+      this.getOrderData();
+    },
+    changeMemberPage(val) {
+      // 修改页码
+      this.memberParams.pageNumber = val;
+      this.getMemberData();
+    },
     changePage(val) {
       // 修改页码
       this.params.pageNumber = val;
@@ -487,19 +526,6 @@ export default {
       this.logParams.pageNumber = val;
       this.getLog();
     },
-    selectGoods(id, checked) {
-      // 选择商品
-      let params = {
-        distributionGoodsId: id,
-        checked: checked,
-      };
-      selectDistGoods(params).then((res) => {
-        if (res.success) {
-          this.$Message.success("操作成功！");
-          this.getGoodsData();
-        }
-      });
-    },
     fenxiao(row) {
       // 分销商品
       this.qrcode = `${this.config.PC_DOMAIN}/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}&distributionId=${this.result.id}`;
@@ -507,6 +533,18 @@ export default {
       this.goodsNameCurr = row.goodsName;
       this.qrcodeShow = true;
     },
+    getOrderData(){
+      // 订单数据
+      getDistOrderList(this.orderParams).then((res) => {
+        if (res.success) this.orderData = res.result;
+      });
+    },
+    getMemberData(){
+      // 订单数据
+      getDistMemberList(this.memberParams).then((res) => {
+        if (res.success) this.memberData = res.result;
+      });
+    },
     getGoodsData() {
       // 商品数据
       getDistGoodsList(this.params).then((res) => {
@@ -519,8 +557,14 @@ export default {
         if (res.success) this.logData = res.result;
       });
     },
+    getGroupData() {
+      // 团队列表
+      getDistGroupList(this.groupParams).then((res) => {
+        if (res.success) this.groupData = res.result;
+      });
+    },
     //申诉
-    repaying(){
+    repaying() {
       applyDistribution().then((res) => {
         this.applyLoading = false;
         if (res.success) {
@@ -537,14 +581,14 @@ export default {
           let type = res.result.distributionStatus;
           if (type === "PASS") {
             this.status = 2;
-            this.getGoodsData();
-          } else if ( type === "REFUSE") {
+            this.getOrderData();
+          } else if (type === "REFUSE") {
             this.status = 0;
           } else if (type === "RETREAT") {
             this.status = 4;
-          }else if (type === "APPEAL") {
+          } else if (type === "APPEAL") {
             this.status = 5;
-          }else {
+          } else {
             this.status = 1;
           }
         } else if (!res.data.success && res.data.code === 22000) {
@@ -563,28 +607,35 @@ export default {
 .box {
   margin: 20px 0;
 }
+
 .page-size {
   margin: 15px 0px;
   text-align: right;
 }
+
 .account-price {
   font-weight: bold;
 }
+
 .subTips {
   margin-left: 10px;
 }
+
 .fontsize_48 {
   font-size: 48px;
 }
+
 .goods-msg {
   display: flex;
   align-items: center;
   padding: 3px;
+
   &:hover {
     color: $theme_color;
     cursor: pointer;
   }
 }
+
 .download-btn {
   // position: relative;
   // top: -200px;
@@ -592,26 +643,31 @@ export default {
   margin-left: 25px;
   margin-top: 5px
 }
+
 /deep/ .ivu-alert-message {
   p {
     margin: 4px 0;
   }
 }
-.tips{
-  background:#f7f7f7;
+
+.tips {
+  background: #f7f7f7;
   padding: 16px;
   border-radius: .4em;
-  >p{
+
+  > p {
     margin: 6px 0;
   }
 }
-.qrcode{
+
+.qrcode {
   display: flex;
   justify-content: space-evenly;
   padding-top: 10px
 
 }
-.qrcode-platform{
+
+.qrcode-platform {
   text-align: center;
   font-size: 14px;
   margin: 5px;
diff --git a/manager/src/api/distribution.js b/manager/src/api/distribution.js
index 15ab8a91..da3d7f01 100644
--- a/manager/src/api/distribution.js
+++ b/manager/src/api/distribution.js
@@ -53,6 +53,11 @@ export const getDistributionCash = (params) => {
 export const auditDistributionCash = (id,params) => {
     return postRequest(`/distribution/cash/audit/${id}`, params)
 }
-
-
-
+//分销会员列表
+export const getDistributionMember = (id,params) => {
+  return getRequest(`/distribution/distribution/memberList/${id}`, params)
+}
+//查看分销团队列表
+export const getDistributionGroup = (id,params) => {
+  return getRequest(`/distribution/distribution/groupList/${id}`, params)
+}
diff --git a/manager/src/router/router.js b/manager/src/router/router.js
index 89e9b6a7..803414ce 100644
--- a/manager/src/router/router.js
+++ b/manager/src/router/router.js
@@ -276,7 +276,19 @@ export const otherRouter = {
       title: "查看直播",
       name: "live-detail",
       component: () => import("@/views/promotions/live/live-detail.vue")
-    }
+    },
+    {
+      path: "group-list",
+      title: "分销团队",
+      name: "group-list",
+      component: () => import("@/views/distribution/distributionGroup.vue")
+    },
+    {
+      path: "distribution-member",
+      title: "分销会员列表",
+      name: "distribution-member",
+      component: () => import("@/views/distribution/distributionMember.vue")
+    },
   ]
 };
 
diff --git a/manager/src/views/distribution/distribution.vue b/manager/src/views/distribution/distribution.vue
index 62eac804..3f762f12 100644
--- a/manager/src/views/distribution/distribution.vue
+++ b/manager/src/views/distribution/distribution.vue
@@ -90,19 +90,23 @@ export default {
         {
           title: "会员名称",
           key: "memberName",
-          minWidth: 120,
+          minWidth: 200,
           tooltip: true,
         },
         {
           title: "推广单数",
           key: "distributionOrderCount",
-          minWidth: 120,
-          width: 150,
+          minWidth: 200,
+        },
+        {
+          title: "推广人数",
+          key: "peopleNum",
+          minWidth: 200,
         },
         {
           title: "分销金额",
           key: "rebateTotal",
-          width: 150,
+          minWidth: 200,
           sortable: false,
           render: (h, params) => {
             return h("priceColorScheme", {props:{value:params.row.rebateTotal,color:this.$mainColor}} );
@@ -110,9 +114,9 @@ export default {
 
         },
         {
-          title: "可用金额",
+          title: "可提现金额",
           key: "canRebate",
-          width: 150,
+          minWidth: 200,
           sortable: false,
           render: (h, params) => {
             return h("priceColorScheme", {props:{value:params.row.canRebate,color:'green'}} );
@@ -121,7 +125,7 @@ export default {
         {
           title: "冻结金额",
           key: "commissionFrozen",
-          width: 150,
+          minWidth: 200,
           sortable: false,
           render: (h, params) => {
             return h("priceColorScheme", {props:{value:params.row.commissionFrozen,color:'#347dda'}} );
@@ -130,7 +134,7 @@ export default {
         {
           title: "状态",
           key: "distributionStatus",
-          width: 150,
+          minWidth: 200,
           sortable: false,
           render: (h, params) => {
             if (params.row.distributionStatus == "PASS") {
@@ -149,7 +153,7 @@ export default {
           key: "action",
           align: "center",
           fixed: "right",
-          width: 140,
+          minWidth: 200,
           render: (h, params) => {
             return h(
               "div",
@@ -159,7 +163,42 @@ export default {
                   justifyContent: "center",
                 },
               },
-              [
+              [h(
+                "Button",
+                {
+                  props: {
+                    type: "success",
+                    size: "small",
+                  },
+                  style: {
+                    marginRight: "5px",
+                  },
+                  on: {
+                    click: () => {
+                      this.memberList(params.row);
+                    },
+                  },
+                },
+                "下级用户"
+              ),
+              h(
+                "Button",
+                {
+                  props: {
+                    type: "info",
+                    size: "small",
+                  },
+                  style: {
+                    marginRight: "5px",
+                  },
+                  on: {
+                    click: () => {
+                      this.groupList(params.row);
+                    },
+                  },
+                },
+                "团队列表"
+                ),
                 h(
                   "Button",
                   {
@@ -214,6 +253,14 @@ export default {
     };
   },
   methods: {
+    //团队列表
+    groupList(row){
+      this.$router.push({ name: "group-list", query: { id: row.id } });
+    },
+    memberList(row){
+      this.$router.push({ name: "distribution-member", query: { id: row.id } });
+
+    },
     // 初始化数据
     init() {
       this.getDataList();
diff --git a/manager/src/views/distribution/distributionGoods.vue b/manager/src/views/distribution/distributionGoods.vue
index 53dca285..33d9e5a2 100644
--- a/manager/src/views/distribution/distributionGoods.vue
+++ b/manager/src/views/distribution/distributionGoods.vue
@@ -102,11 +102,6 @@ export default {
           },
 
         },
-        {
-          title: "库存",
-          key: "quantity",
-          minWidth: 80,
-        },
         {
           title: "添加时间",
           key: "createTime",
diff --git a/manager/src/views/distribution/distributionGroup.vue b/manager/src/views/distribution/distributionGroup.vue
new file mode 100644
index 00000000..c82ee906
--- /dev/null
+++ b/manager/src/views/distribution/distributionGroup.vue
@@ -0,0 +1,103 @@
+<template>
+  <div>
+    <Card>
+      <Table :loading="loading" border :columns="columns" :data="data" ref="table" class="mt_10"></Table>
+      <Row type="flex" justify="end" class="page padding-row">
+        <Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize" @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10,20,50]" size="small" show-total show-elevator show-sizer></Page>
+      </Row>
+    </Card>
+  </div>
+</template>
+
+<script>
+import {
+  getDistributionGroup
+} from "@/api/distribution";
+import {cashStatusList} from './dataJson'
+export default {
+  name: "distributionGroup",
+  data() {
+    return {
+      id: "",//分销员id
+      cashStatusList, // 状态列表
+      loading: true, // 表单加载状态
+      modalVisible: false, // 添加或编辑显示
+      modalTitle: "", // 添加或编辑标题
+      result: 'FAIL_AUDITING', // 是否通过
+      searchForm: { // 搜索框初始化对象
+        pageNumber: 1, // 当前页数
+        pageSize: 10, // 页面大小
+        sort: "createTime", // 默认排序字段
+        order: "desc", // 默认排序方式
+      },
+      handleStatus:'edit',// 判断是编辑还是查看
+      form: { // 添加或编辑表单对象初始化数据
+        sn: "",
+        memberName: "",
+        price: "",
+      },
+      submitLoading: false, // 添加或编辑提交状态
+      columns: [
+        {
+          title: "昵称",
+          key: "memberName",
+          minWidth: 200
+        },
+        {
+          title: "销售额",
+          key: "distributionOrderPrice",
+          minWidth: 120
+        },
+        {
+          title: "订单量",
+          key: "distributionOrderCount",
+          minWidth: 120
+        },
+      ],
+      data: [], // 表单数据
+      total: 0 // 表单数据总数
+    };
+  },
+  methods: {
+    // 初始化数据
+    init() {
+      this.getDataList();
+    },
+    // 改变页码
+    changePage(v) {
+      this.searchForm.pageNumber = v;
+      this.getDataList();
+    },
+    // 改变页数
+    changePageSize(v) {
+      this.searchForm.pageSize = v;
+      this.getDataList();
+    },
+    // 搜索
+    handleSearch() {
+      this.searchForm.pageNumber = 1;
+      this.searchForm.pageSize = 10;
+      this.getDataList();
+    },
+    // 获取列表数据
+    getDataList() {
+      this.loading = true;
+      console.log(this.id);
+      // 带多条件搜索参数获取表单数据 请自行修改接口
+      getDistributionGroup(this.id,this.searchForm).then(res => {
+        this.loading = false;
+        if (res.success) {
+          this.data = res.result.records;
+          this.total = res.result.total;
+        }
+      });
+      this.total = this.data.length;
+      this.loading = false;
+    },
+  },
+  mounted() {
+    this.id = this.$route.query.id;
+    this.init();
+  }
+};
+</script>
diff --git a/manager/src/views/distribution/distributionMember.vue b/manager/src/views/distribution/distributionMember.vue
new file mode 100644
index 00000000..8943802c
--- /dev/null
+++ b/manager/src/views/distribution/distributionMember.vue
@@ -0,0 +1,114 @@
+<template>
+  <div>
+    <Card>
+      <Table :loading="loading" border :columns="columns" :data="data" ref="table" class="mt_10"></Table>
+      <Row type="flex" justify="end" class="page padding-row">
+        <Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize" @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10,20,50]" size="small" show-total show-elevator show-sizer></Page>
+      </Row>
+    </Card>
+  </div>
+</template>
+
+<script>
+import {
+  getDistributionCash,
+  auditDistributionCash, getDistributionMember
+} from "@/api/distribution";
+import {cashStatusList} from './dataJson'
+export default {
+  name: "distributionMember",
+  data() {
+    return {
+      id: "",//分销员id
+      cashStatusList, // 状态列表
+      loading: true, // 表单加载状态
+      modalVisible: false, // 添加或编辑显示
+      modalTitle: "", // 添加或编辑标题
+      result: 'FAIL_AUDITING', // 是否通过
+      searchForm: { // 搜索框初始化对象
+        pageNumber: 1, // 当前页数
+        pageSize: 10, // 页面大小
+        sort: "createTime", // 默认排序字段
+        order: "desc", // 默认排序方式
+      },
+      handleStatus:'edit',// 判断是编辑还是查看
+      form: { // 添加或编辑表单对象初始化数据
+        sn: "",
+        memberName: "",
+        price: "",
+      },
+      submitLoading: false, // 添加或编辑提交状态
+      columns: [
+        {
+          title: "客户昵称",
+          key: "nickName",
+          minWidth: 200
+        },
+        {
+          title: "成交额",
+          key: "orderPrice",
+          minWidth: 120
+        },
+        {
+          title: "佣金总额",
+          key: "rebatePrice",
+          minWidth: 120
+        },
+        {
+          title: "订单数",
+          key: "orderNum",
+          minWidth: 130
+        },
+        {
+          title: "最近下单时间",
+          key: "lastLoginDate",
+          minWidth: 130
+        },
+      ],
+      data: [], // 表单数据
+      total: 0 // 表单数据总数
+    };
+  },
+  methods: {
+    // 初始化数据
+    init() {
+      this.getDataList();
+    },
+    // 改变页码
+    changePage(v) {
+      this.searchForm.pageNumber = v;
+      this.getDataList();
+    },
+    // 改变页数
+    changePageSize(v) {
+      this.searchForm.pageSize = v;
+      this.getDataList();
+    },
+    // 搜索
+    handleSearch() {
+      this.searchForm.pageNumber = 1;
+      this.searchForm.pageSize = 10;
+      this.getDataList();
+    },
+    // 获取列表数据
+    getDataList() {
+      this.loading = true;
+      console.log(this.id);
+      // 带多条件搜索参数获取表单数据 请自行修改接口
+      getDistributionMember(this.id,this.searchForm).then(res => {
+        this.loading = false;
+        if (res.success) {
+          this.data = res.result.records;
+          this.total = res.result.total;
+        }
+      });
+      this.total = this.data.length;
+      this.loading = false;
+    },
+  },
+  mounted() {
+    this.id = this.$route.query.id;
+    this.init();
+  }
+};
+</script>
diff --git a/manager/src/views/distribution/distributionOrder.vue b/manager/src/views/distribution/distributionOrder.vue
index 53a372f1..7c63d4b7 100644
--- a/manager/src/views/distribution/distributionOrder.vue
+++ b/manager/src/views/distribution/distributionOrder.vue
@@ -11,7 +11,7 @@
             style="width: 200px"
           />
         </Form-item>
-        <Form-item label="分销商" prop="distributionName">
+        <Form-item label="分销员" prop="distributionName">
           <Input
             type="text"
             v-model="searchForm.distributionName"
@@ -104,7 +104,7 @@
           },
 
           {
-            title: "分销商",
+            title: "分销员",
             key: "distributionName",
             tooltip: true,
             minWidth:80,
diff --git a/manager/src/views/distribution/distributionSetting.vue b/manager/src/views/distribution/distributionSetting.vue
index 68ee5629..5f4438e1 100644
--- a/manager/src/views/distribution/distributionSetting.vue
+++ b/manager/src/views/distribution/distributionSetting.vue
@@ -1,7 +1,7 @@
 <template>
   <div style="background-color: #fff;">
 
-    <Form ref="form" :model="form" :rules="formRule" :label-width="120" style="padding: 10px;">
+    <Form ref="form" :model="form" :label-width="120" style="padding: 10px;">
 
       <Divider orientation="left">分销设置</Divider>
       <FormItem label="是否开启分销" prop="isOpen">
@@ -10,12 +10,110 @@
           <span slot="close">关闭</span>
         </i-switch>
       </FormItem>
-      <FormItem label="分销关系绑定天数" prop="distributionDay">
-        <InputNumber :min="1" :max="365" style="width:100px;" v-model="form.distributionDay"></InputNumber>
+      <FormItem label="分销层级" prop="level">
+        <RadioGroup v-model="form.level" size="large">
+          <Radio label="1">1级</Radio>
+          <Radio label="2">2级</Radio>
+        </RadioGroup>
       </FormItem>
-      <FormItem label="分销结算天数" prop="cashDay">
-        <InputNumber :min="0"  :max="365"  style="width:100px;" v-model="form.cashDay"></InputNumber>
+      <FormItem label="分销模式" prop="mode">
+        <RadioGroup v-model="form.mode" size="large">
+          <Radio label="1">指定分销</Radio>
+          <Radio label="2">人人分销</Radio>
+        </RadioGroup>
       </FormItem>
+      <FormItem label="分销关系绑定" prop="binding">
+        <RadioGroup v-model="form.binding" size="large">
+          <Radio label="ALL">所有用户</Radio>
+          <Radio label="NEW">新用户</Radio>
+        </RadioGroup>
+      </FormItem>
+      <FormItem label="分销绑定模式" prop="validity">
+        <RadioGroup v-model="form.validity" size="large">
+          <Radio label="FOREVER">永久</Radio>
+          <Radio label="EXP">有效期</Radio>
+        </RadioGroup>
+      </FormItem>
+      <FormItem label="有效期天数" prop="validityDay">
+        <InputNumber :min="1" :max="365" style="width:200px;" v-model="form.validityDay"></InputNumber>
+      </FormItem>
+
+      <Divider orientation="left">返佣设置</Divider>
+      <FormItem label="佣金模式" prop="commissionModel">
+        <RadioGroup v-model="form.commissionModel"  size="large">
+          <Radio label="1">平台承担</Radio>
+          <Radio label="2">商户承担</Radio>
+        </RadioGroup>
+      </FormItem>
+      <FormItem label="一级佣金比例" prop="firstCommission">
+        <InputNumber :min="0" :max="100"
+                     v-model="form.firstCommission"
+                     :formatter="value => `${value}%`"
+                     :parser="value => value.replace('%', '')">
+        </InputNumber>
+      </FormItem>
+      <FormItem label="二级佣金比例" prop="secondaryCommission">
+        <InputNumber :min="0"
+                     :max="100"
+                     v-model="form.secondaryCommission"
+                     :formatter="value => `${value}%`"
+                     :parser="value => value.replace('%', '')">
+         </InputNumber>
+      </FormItem>
+      <FormItem label="自购返佣" prop="selfCommission">
+        <RadioGroup v-model="form.selfCommission"  size="large">
+          <Radio label="1">开启</Radio>
+          <Radio label="2">关闭</Radio>
+        </RadioGroup>
+      </FormItem>
+      <FormItem label="推广返佣" prop="promotion">
+        <RadioGroup v-model="form.promotion"  size="large">
+          <Radio label="1">开启</Radio>
+          <Radio label="2">关闭</Radio>
+        </RadioGroup>
+      </FormItem>
+
+      <FormItem label="每日最大推广数量" prop="maxPromotionNum">
+        <InputNumber :min="0" :max="1000" style="width:200px;" v-model="form.maxPromotionNum"></InputNumber>
+      </FormItem>
+
+<!--      <Divider orientation="left">提现设置</Divider>-->
+<!--      <FormItem label="佣金模式" prop="withdrawalType">-->
+<!--        <RadioGroup v-model="form.withdrawalType" type="button" button-style="solid">-->
+<!--          <Radio label="1">线下转账</Radio>-->
+<!--          <Radio label="2">微信零钱</Radio>-->
+<!--        </RadioGroup>-->
+<!--      </FormItem>-->
+<!--      <FormItem label="提现最低金额" prop="minPrice">-->
+<!--        <Input type="number" style="width:200px;" v-model="form.minPrice">-->
+<!--        </Input>-->
+<!--      </FormItem>-->
+<!--      <FormItem label="提现最高金额" prop="maxPrice">-->
+<!--        <Input type="number" style="width:200px;" v-model="form.maxPrice">-->
+<!--        </Input>-->
+<!--      </FormItem>-->
+<!--      <FormItem label="提现手续费" prop="fee">-->
+<!--        <Input type="number" style="width:200px;" v-model="form.fee">-->
+<!--        </Input>-->
+<!--      </FormItem>-->
+<!--      <FormItem label="是否支持银行卡" prop="withdrawalBank">-->
+<!--        <i-switch size="large" v-model="form.withdrawalBank" :true-value="true" :false-value="false">-->
+<!--          <span slot="open">开启</span>-->
+<!--          <span slot="close">关闭</span>-->
+<!--        </i-switch>-->
+<!--      </FormItem>-->
+<!--      <FormItem label="是否支持微信" prop="withdrawalWechat">-->
+<!--        <i-switch size="large" v-model="form.withdrawalWechat" :true-value="true" :false-value="false">-->
+<!--          <span slot="open">开启</span>-->
+<!--          <span slot="close">关闭</span>-->
+<!--        </i-switch>-->
+<!--      </FormItem>-->
+<!--      <FormItem label="是否支持支付宝" prop="withdrawalAli">-->
+<!--        <i-switch size="large" v-model="form.withdrawalAli" :true-value="true" :false-value="false">-->
+<!--          <span slot="open">开启</span>-->
+<!--          <span slot="close">关闭</span>-->
+<!--        </i-switch>-->
+<!--      </FormItem>-->
       <FormItem>
         <Button type="primary" @click="submit">保存</Button>
       </FormItem>
@@ -24,8 +122,8 @@
 </template>
 
 <script>
-import { setSetting, getSetting } from "@/api/index";
-import { regular } from "@/utils";
+import {getSetting, setSetting} from "@/api/index";
+
 export default {
   name: "distributionSetting",
   data() {
@@ -33,20 +131,36 @@ export default {
       form: {
         // 添加或编辑表单对象初始化数据
         isOpen: true,
-        distributionDay: 0, //分销关系绑定天数
-        cashDay: 0, //分销结算天数
+        level: 1, //分销层级
+        mode: 0, //分销模式(指定分销/人人分销)
+        binding: "NEW", //分销关系绑定（新用户/所有用户）
+        validity: "FOREVER", //分销绑定模式（有效期/永久）
+        validityDay: 0, //有效期天数
+        commissionModel: 0, //佣金模式（平台承担/商户承担）
+        firstCommission: 0, //一级佣金比例
+        secondaryCommission: 0, //二级佣金比例
+        selfCommission: 0, //自购返佣
+        promotion: 0, //推广返佣
+        maxPromotionNum: 0, //每日最大推广数量
+        // withdrawalType: 0, //提现方式（线下转账/微信零钱）
+        // minPrice: 0, //提现最低金额
+        // maxPrice: 0, //提现最高金额
+        // fee: 0, //提现手续费
+        // withdrawalBank: false, //是否支持银行卡
+        // withdrawalWechat: false, //是否支持微信
+        // withdrawalAli: false, //是否支持支付宝
       },
-      formRule: {
-        isOpen: [
-          regular.REQUIRED
-        ],
-        distributionDay: [
-          regular.REQUIRED
-        ],
-        cashDay: [
-          regular.REQUIRED
-        ],
-      }
+      // formRule: {
+      //   isOpen: [
+      //     regular.REQUIRED
+      //   ],
+      //   distributionDay: [
+      //     regular.REQUIRED
+      //   ],
+      //   cashDay: [
+      //     regular.REQUIRED
+      //   ],
+      // }
     };
   },
   methods: {
diff --git a/seller/src/api/distribution.js b/seller/src/api/distribution.js
index da525f6d..94553ede 100644
--- a/seller/src/api/distribution.js
+++ b/seller/src/api/distribution.js
@@ -2,71 +2,22 @@
 // 统一请求路径前缀在libs/axios.js中修改
 import {getRequest, postRequest, putRequest, deleteRequest, importRequest, getRequestWithNoToken} from '@/libs/axios';
 
-
-//获取分销商品列表
-export const getDistributionGoods = (params) => {
-  return getRequest('/distribution/goods', params)
-}
-
-// 取消分销商品
-export const distributionGoodsCancel = (id) => {
-  return deleteRequest(`/distribution/goods/cancel/${id}`)
-}
-
-// 选择分销商品
-export const distributionGoodsCheck = (id,param) => {
-  return putRequest(`/distribution/goods/checked/${id}`,param)
-}
-
-
-//查询分销商
-export const getDistributionListData = (params) => {
-    return getRequest('/distribution/getByPage', params)
-}
-//审核分销商
-export const auditDistribution = (id, params) => {
-    return putRequest(`/distribution/audit/${id}`, params)
-}
-
-// 清退分销商
-export const retreatDistribution = (id, params) => {
-    return putRequest(`/distribution/retreat/${id}`, params)
-}
-
-// 恢复分销商
-export const resumeDistribution = (id, params) => {
-    return putRequest(`/distribution/resume/${id}`, params)
+//获取分销设置
+export const getDistributionSetting = (params) => {
+  return getRequest(`/distribution/setting`, params)
 }
 
 //保存更新分销设置
 export const saveDistributionSetting = (params) => {
-    return postRequest('/distribution/setting/insertOrUpdate', params)
+    return putRequest('/distribution/setting', params)
 }
 
-//获取分销设置
-export const getDistributionSetting = (id, params) => {
-    return getRequest(`/distribution/setting/get/${id}`, params)
-}
-
-
 //获取分销订单列表
 export const getDistributionOrder = (params) => {
     return getRequest('/distribution/order', params)
 }
 
-
-//删除分销商品
-export const delDistributionGoods = (ids) => {
-    return deleteRequest(`/distribution/goods/delByIds/${ids}`)
+//获取分销商品列表
+export const getDistributionGoods = (params) => {
+  return getRequest('/distribution/goods', params)
 }
-//获取分销佣金信息
-export const getDistributionCash = (params) => {
-    return getRequest('/distribution/cash/getByPage', params)
-}
-//审核分销佣金申请
-export const auditDistributionCash = (id,params) => {
-    return postRequest(`/distribution/cash/audit/${id}`, params)
-}
-
-
-
diff --git a/seller/src/views/distribution/distributionSetting.vue b/seller/src/views/distribution/distributionSetting.vue
new file mode 100644
index 00000000..74d33006
--- /dev/null
+++ b/seller/src/views/distribution/distributionSetting.vue
@@ -0,0 +1,96 @@
+<template>
+  <div class="search">
+    <Card style="margin-left: 10px">
+      <Tabs v-model="type">
+        <TabPane label="分销设置" name="INFO">
+          <Form ref="form" :model="form" :label-width="100" >
+            <FormItem label="是否开启分销" prop="isOpen" class="wangEditor">
+              <i-switch v-model="form.isOpen"></i-switch>
+              <span class="desc">开启分销，则全店商品具有分销功能</span>
+            </FormItem>
+            <FormItem label="一级佣金比例" prop="isOpen">
+              <InputNumber :min="0" :max="99999" v-model="form.commission" type="number" maxlength="2"
+                           clearable style="width: 20%"/>
+            </FormItem>
+            <FormItem label="二级分佣比例" prop="stockWarning">
+              <InputNumber :min="0" :max="99999" v-model="form.secondaryCommission" type="number"
+                           maxlength="2"
+                           clearable style="width: 20%"/>
+            </FormItem>
+            <Form-item>
+              <Button @click="handleSubmit" :loading="submitLoading" type="primary" style="margin-right: 5px">修改
+              </Button>
+            </Form-item>
+          </Form>
+        </TabPane>
+      </Tabs>
+    </Card>
+  </div>
+</template>
+
+<script>
+import {getDistributionSetting, saveDistributionSetting} from "@/api/distribution";
+
+export default {
+  name: "distributionSetting",
+  components: {},
+  data() {
+    return {
+      type: "INFO",
+      form: {
+        // 添加或编辑表单对象初始化数据
+        isOpen: false, // 是否开启分销
+        commission: 0, // 一级佣金比例
+        secondaryCommission: 0, //二级分佣比例
+      },
+      // 表单验证规则
+      validate: {},
+      submitLoading: false, // 添加或编辑提交状态
+
+    };
+  },
+  methods: {
+
+    // 初始化数据
+    init() {
+      this.getDistributionSetting();
+
+    },
+
+    //获取店铺信息
+    getDistributionSetting() {
+      this.loading = true;
+      getDistributionSetting().then((res) => {
+        this.loading = false;
+        if (res.success) {
+          this.form = res.result;
+        }
+      });
+    },
+    //提交保存
+    handleSubmit() {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          this.submitLoading = true;
+          saveDistributionSetting(this.form).then((res) => {
+            this.submitLoading = false;
+            if (res.success) {
+              this.$Message.success("修改成功");
+              this.getDistributionSetting();
+            }
+          });
+        }
+      });
+    },
+  },
+  mounted() {
+    this.init();
+  },
+};
+</script>
+<style scoped lang="scss">
+.desc {
+  margin-left: 10px;
+  color: #999;
+}
+</style>

From fb20cb32dad600f6582ef3c7f54d8cab454a45b3 Mon Sep 17 00:00:00 2001
From: "pikachu1995@126.com" <pikachu1995@126.com>
Date: Wed, 24 Jan 2024 09:46:59 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E7=BB=93=E7=AE=97=E5=8D=95=E8=AF=A6?=
 =?UTF-8?q?=E6=83=85=E8=B0=83=E4=BC=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 manager/src/api/shops.js                      |   6 +
 manager/src/libs/axios.js                     |  14 +-
 manager/src/views/seller/bill/bill-detail.vue | 923 ++++++++++--------
 seller/src/api/shops.js                       |   4 +
 seller/src/views/shop/bill/billDetail.vue     | 919 ++++++++---------
 5 files changed, 1037 insertions(+), 829 deletions(-)

diff --git a/manager/src/api/shops.js b/manager/src/api/shops.js
index 93d3493e..36cba3c3 100644
--- a/manager/src/api/shops.js
+++ b/manager/src/api/shops.js
@@ -81,3 +81,9 @@ export const getShopList = () => {
 export const getShopByMemberId = (id) => {
   return getRequest(`/store/store/${id}/member`)
 }
+
+//根据id获取店铺信息
+export const downloadBill = (id) => {
+  return getRequest(`/order/bill/downLoad/${id}`, {}, 'blob')
+}
+
diff --git a/manager/src/libs/axios.js b/manager/src/libs/axios.js
index e49d796c..79e7e5ff 100644
--- a/manager/src/libs/axios.js
+++ b/manager/src/libs/axios.js
@@ -171,18 +171,24 @@ function getTokenDebounce() {
   };
 }
 
-export const getRequest = (url, params) => {
+export const getRequest = (url, params, resBlob) => {
   let accessToken = getStore("accessToken");
-  return service({
+  let data = {
     method: "get",
     url: `${url}`,
     params: params,
     headers: {
       accessToken: accessToken
-    }
-  });
+    },
+    responseType: "blob"
+  };
+  if (resBlob != "blob") {
+    delete data.responseType;
+  }
+  return service(data);
 };
 
+
 export const postRequest = (url, params, headers) => {
   let accessToken = getStore("accessToken");
   return service({
diff --git a/manager/src/views/seller/bill/bill-detail.vue b/manager/src/views/seller/bill/bill-detail.vue
index b3743bcf..802e14a6 100644
--- a/manager/src/views/seller/bill/bill-detail.vue
+++ b/manager/src/views/seller/bill/bill-detail.vue
@@ -1,161 +1,252 @@
 <template>
   <div>
     <Card>
-      <p slot="title">商家信息</p>
+      <p slot="title">结算单详情</p>
       <div class="flex flex_align_item">
-        <p>店铺名称：{{ bill.storeName }}</p>
-        <p>银行开户名：{{ bill.bankAccountName }}</p>
-        <p>银行账号：{{ bill.bankAccountNumber }}</p>
-        <p>开户行支行名称：{{ bill.bankName }}</p>
-        <p>支行联行号：{{ bill.bankCode }}</p>
-      </div>
-    </Card>
-    <Card class="mt_10 mb_10">
-      <p slot="title">账单详细</p>
-
-      <div class="tips-status">
-        <span>账单状态 ：</span>
-        <span class="theme_color">{{
-          bill.billStatus | unixSellerBillStatus
-        }}</span>
-        <Button
-          v-if="bill.billStatus == 'CHECK'"
-          size="mini"
-          type="primary"
-          @click="pass()"
-          >付款</Button
-        >
-      </div>
-
-      <table>
-        <tbody>
-          <tr v-for="(item, index) in data" :key="index">
-            <td>{{ item.name }}：</td>
-            <td>{{ item.value }}</td>
-          </tr>
-        </tbody>
-      </table>
-      <div>
-        <h3 class="ml_10" style="padding:10px;">结算详细</h3>
-        <div class="bill-detail-price">
-
-          <span>
-            <p>积分结算金额</p>
-            <p class="increase-color">
-              +{{ bill.pointSettlementPrice || 0 | unitPrice("￥") }}
-            </p>
-          </span>
-          <span>
-            <p>平台优惠券补贴</p>
-            <p class="increase-color">
-              +{{ bill.siteCouponCommission || 0 | unitPrice("￥") }}
-            </p>
-          </span>
-
-          <span>
-            <p>砍价商品结算金额</p>
-            <p class="increase-color">
-              +{{ bill.kanjiaSettlementPrice || 0 | unitPrice("￥") }}
-            </p>
-          </span>
-          <span>
-            <p>退单分销返现返还</p>
-            <p class="increase-color">
-              +{{ bill.distributionRefundCommission || 0 | unitPrice("￥") }}
-            </p>
-          </span>
-          <span>
-            <p>退单产生退还佣金金额</p>
-            <p class="increase-color">
-              +{{ bill.refundCommissionPrice || 0 | unitPrice("￥") }}
-            </p>
-          </span>
-           <span>
-            <p>退单金额</p>
-            <p class="theme_color">
-              -{{ bill.refundPrice || 0 | unitPrice("￥") }}
-            </p>
-          </span>
-
-          <span>
-            <p>平台收取佣金</p>
-            <p class="theme_color">
-              -{{ bill.commissionPrice || 0 | unitPrice("￥") }}
-            </p>
-          </span>
-          <span>
-            <p>分销返现支出</p>
-            <p class="theme_color">
-              -{{ bill.distributionCommission || 0 | unitPrice("￥") }}
-            </p>
-          </span>
-          <span>
-            <p>退单平台优惠券补贴返还</p>
-            <p class="theme_color">
-              -{{ bill.siteCouponRefundCommission || 0 | unitPrice("￥") }}
-            </p>
-          </span>
+        <div class="procedure">
+          <div class="procedure_item" v-for="(item, index) in billStatusStep">
+            <div class="icon" :class="item.className">
+              <Icon type="md-checkmark" size="14" v-if="item.className==='' || bill.billStatus === 'COMPLETE'" />
+              <span v-else>{{index + 1}}</span>
+            </div>
+            <div class="text">{{item.title}}</div>
+          </div>
+        </div>
+        <div>
+          <Button v-if="bill.billStatus == 'CHECK'" type="success" @click="pass()" style="margin-left: 10px;">付款</Button>
+          <Button type="info" @click="download()" style="margin-left: 10px;">下载账单</Button>
         </div>
       </div>
     </Card>
-    <Tabs active-key="key1" @on-click="clickTabs">
-      <Tab-pane label="入账流水" key="key1">
-        <Card>
-          <Table
-            :loading="loading"
-            border
-            :columns="orderColumns"
-            :data="order"
-            ref="table"
-          ></Table>
+    <Card class="mt_10">
+      <p slot="title">账单详细</p>
+      <table>
+        <tbody>
+        <tr v-for="(item,index) in data" :key="index">
+          <td>{{ item.name }}</td>
+          <td>{{ item.value }}</td>
+        </tr>
+        </tbody>
+      </table>
+      <div>
+        <h3 class="ml_10">结算详细</h3>
+        <Table :columns="billColumns" :data="billData"></Table>
+        <div class="bill-detail-price">
+          <div class="flex bill-item">
+          </div>
+        </div>
+      </div>
+    </Card>
+    <Card class="mt_10">
+      <Tabs active-key="tab" type="card">
+        <Tab-pane label="结算单流水" name="order">
+          <Table :loading="loading" border :columns="orderColumns" :data="orderData" ref="table"></Table>
           <Row type="flex" justify="end" class="mt_10">
-            <Page
-              :current="orderParam.pageNumber"
-              :total="orderTotal"
-              :page-size="orderParam.pageSize"
-              @on-change="orderChangePage"
-              @on-page-size-change="orderChangePageSize"
-              size="small"
-              show-total
-              show-elevator
-            ></Page>
+            <Page :current="orderParam.pageNumber" :total="orderTotal" :page-size="orderParam.pageSize"
+                  @on-change="orderChangePage" @on-page-size-change="orderChangePageSize" size="small" show-total
+                  show-elevator></Page>
           </Row>
-        </Card>
-      </Tab-pane>
-      <Tab-pane label="退款流水" key="key2">
-        <Card>
-          <Table
-            :loading="loading"
-            border
-            :columns="refundColumns"
-            :data="refund"
-            ref="table"
-          ></Table>
-          <Row type="flex" justify="end" class="mt_10">
-            <Page
-              :current="refundParam.pageNumber"
-              :total="refundTotal"
-              :page-size="refundParam.pageSize"
-              @on-change="getRefund()"
-              @on-page-size-change="getRefund()"
-              size="small"
-              show-total
-              show-elevator
-            ></Page>
-          </Row>
-        </Card>
-      </Tab-pane>
-    </Tabs>
+        </Tab-pane>
+      </Tabs>
+    </Card>
   </div>
 </template>
 <script>
 import * as filters from "@/utils/filters";
 import * as API_Shop from "@/api/shops";
+
 export default {
   name: "bill-detail",
   data() {
     return {
       loading: false,
+      billColumns: [
+        {
+          title: '结算金额',
+          key: 'billPrice',
+          align: 'center',
+          width: 200,
+          fixed: 'left',
+          render: (h, params) => {
+            return h(
+              "div",
+              this.$options.filters.unitPrice(params.row.billPrice, "￥")
+            );
+          },
+        },
+        {
+          title: '收入',
+          key: 'pay',
+          align: 'center',
+          children: [
+            {
+              title: '用户实付',
+              key: 'orderPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.orderPrice, "￥")
+                );
+              },
+            }, {
+              title: '平台优惠券补贴',
+              key: 'siteCouponCommission',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.siteCouponCommission, "￥")
+                );
+              },
+            }, {
+              title: '积分商品补贴',
+              key: 'pointSettlementPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.pointSettlementPrice, "￥")
+                );
+              },
+            }, {
+              title: '砍价商品补贴',
+              key: 'kanjiaSettlementPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.kanjiaSettlementPrice, "￥")
+                );
+              },
+            }, {
+              title: '分销佣金',
+              key: 'distributionCommission',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {
+                  props: {
+                    value: (0 - params.row.distributionCommission),
+                    color: this.$mainColor
+                  }
+                });
+              },
+            }, {
+              title: '平台服务费',
+              key: 'commissionPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {
+                  props: {
+                    value: (0 - params.row.commissionPrice),
+                    color: this.$mainColor
+                  }
+                });
+              },
+            },
+          ]
+        },
+        {
+          title: '退款',
+          key: 'refund',
+          align: 'center',
+          children: [
+            {
+              title: '退款金额',
+              key: 'refundPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {props: {value: (0 - params.row.refundPrice), color: this.$mainColor}});
+              },
+            }, {
+              title: '退单返还平台优惠券补贴',
+              key: 'siteCouponRefundCommission',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {
+                  props: {
+                    value: (0 - params.row.siteCouponRefundCommission),
+                    color: this.$mainColor
+                  }
+                });
+              },
+            }, {
+              title: '退单返还积分商品补贴',
+              key: 'pointRefundSettlementPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {
+                  props: {
+                    value: (0 - params.row.pointRefundSettlementPrice),
+                    color: this.$mainColor
+                  }
+                });
+              },
+            }, {
+              title: '退单返还砍价商品补贴',
+              key: 'kanjiaRefundSettlementPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {
+                  props: {
+                    value: (0 - params.row.kanjiaRefundSettlementPrice),
+                    color: this.$mainColor
+                  }
+                });
+              },
+            }, {
+              title: '退单返还分销佣金',
+              key: 'distributionRefundCommission',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.distributionRefundCommission, "￥")
+                );
+              },
+            }, {
+              title: '退单返还平台服务费',
+              key: 'refundCommissionPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.refundCommissionPrice, "￥")
+                );
+              },
+            },
+          ]
+        },
+      ],
+      billData: [
+        {
+          billPrice: 0,
+          orderPrice: 0,
+          siteCouponCommission: 0,
+          pointSettlementPrice: 0,
+          kanjiaSettlementPrice: 0,
+          distributionCommission: 0,
+          commissionPrice: 0,
+          refundPrice: 0,
+          siteCouponRefundCommission: 0,
+          pointRefundSettlementPrice: 0,
+          kanjiaRefundSettlementPrice: 0,
+          distributionRefundCommission: 0,
+          refundCommissionPrice: 0
+        },
+      ],
       columns: [
         // 表头
         {
@@ -202,10 +293,14 @@ export default {
           name: "计算中",
           value: 0,
         },
+        {
+          name: "计算中",
+          value: 0,
+        },
       ],
       id: "", // 账单id
       bill: {}, // 账单详情
-      order: [], // 订单列表
+      orderData: [], // 订单列表
       orderParam: {
         // 请求参数
         pageNumber: 1, // 当前页数
@@ -217,198 +312,184 @@ export default {
         endDate: null,
       },
       orderColumns: [
-        // 订单表头
         {
-          title: "入账时间",
-          key: "createTime",
-          minWidth: 120,
-          tooltip: true,
+          title: '结算信息',
+          key: 'pay',
+          align: 'center',
+          children: [
+            {
+              title: "时间",
+              key: "createTime",
+            },
+            {
+              title: "订单编号",
+              key: "orderSn",
+              width: 250,
+            },
+            {
+              title: "子订单号",
+              key: "orderItemSn",
+              width: 250,
+            },
+            {
+              title: "类型",
+              key: "flowType",
+              render: (h, params) => {
+                if (params.row.flowType == "PAY") {
+                  return h("div", [
+                    h("tag", {props: {color: "blue"}}, "收款"),
+                  ]);
+                } else {
+                  return h("div", [
+                    h("tag", {props: {color: "magenta"}}, "退款"),
+                  ]);
+                }
+              }
+            },
+            {
+              title: "结算金额",
+              key: "billPrice",
+              render: (h, params) => {
+                if (params.row.flowType == "PAY") {
+                  return h("div", this.$options.filters.unitPrice(params.row.billPrice, "￥")
+                  );
+                } else {
+                  return h("priceColorScheme", {props: {value: (0 - params.row.finalPrice), color: this.$mainColor}});
+                }
+              },
+            },
+          ]
         },
         {
-          title: "订单编号",
-          key: "orderSn",
-          minWidth: 120,
-          tooltip: true,
-        },
-        {
-          title: "订单金额",
-          key: "finalPrice",
-          width: 120,
-          render: (h, params) => {
-            return h("priceColorScheme", {props:{value:params.row.finalPrice,color:this.$mainColor}} );
+          title: '收入',
+          key: 'pay',
+          align: 'center',
+          children: [{
+            title: "补贴",
+            key: "billPrice",
+            render: (h, params) => {
+              if (params.row.pointSettlementPrice == 0) {
+                return h("div", "-");
+              } else if (params.row.flowType == "PAY") {
+                return h("div", this.$options.filters.unitPrice((params.row.pointSettlementPrice + params.row.kanjiaSettlementPrice + params.row.siteCouponCommission), "￥")
+                );
+              } else {
+                return h("priceColorScheme", {props: {value: (0 - (params.row.pointSettlementPrice + params.row.kanjiaSettlementPrice + params.row.siteCouponCommission))}});
+              }
+            },
           },
+            {
+              title: "用户实付",
+              key: "billPrice",
+              render: (h, params) => {
+                if (params.row.flowType == "PAY") {
+                  return h("div", this.$options.filters.unitPrice(params.row.siteCouponCommission, "￥")
+                  );
+                } else {
+                  return h("priceColorScheme", {props: {value: (0 - params.row.siteCouponCommission)}});
+                }
+              },
+            },
+            {
+              title: "合计",
+              key: "billPrice",
+              render: (h, params) => {
+                if (params.row.flowType == "PAY") {
+                  return h("div", this.$options.filters.unitPrice(params.row.finalPrice, "￥")
+                  );
+                } else {
+                  return h("priceColorScheme", {props: {value: (0 - params.row.billPrice)}});
+                }
+              },
+            },
+          ]
+        },
+        {
+          title: '支出',
+          key: 'pay',
+          align: 'center',
+          children: [{
+            title: "平台服务费",
+            key: "billPrice",
+            render: (h, params) => {
+              if (params.row.commissionPrice == 0) {
+                return h("div", "-");
+              } else if (params.row.flowType == "PAY") {
+                return h("div", this.$options.filters.unitPrice(params.row.commissionPrice, "￥")
+                );
+              } else {
+                return h("priceColorScheme", {props: {value: (0 - params.row.commissionPrice)}});
+              }
+            },
+          },
+            {
+              title: "分销佣金",
+              key: "distributionRebate",
+              render: (h, params) => {
+                if (params.row.distributionRebate == 0) {
+                  return h("div", "-");
+                } else if (params.row.flowType == "PAY") {
+                  return h("div", this.$options.filters.unitPrice(params.row.distributionRebate, "￥")
+                  );
+                } else {
+                  return h("priceColorScheme", {props: {value: (0 - params.row.distributionRebate)}});
+                }
+              },
+            },
+            {
+              title: "合计",
+              key: "billPrice",
+              render: (h, params) => {
+                if (params.row.flowType == "PAY") {
+                  return h("div", this.$options.filters.unitPrice((params.row.commissionPrice + params.row.distributionRebate), "￥")
+                  );
+                } else {
+                  return h("priceColorScheme", {props: {value: (0 - (params.row.commissionPrice + params.row.distributionRebate))}});
+                }
+              },
+            }]
+        }
 
-        },
-        {
-          title: "平台分佣",
-          key: "commissionPrice",
-          width: 120,
-          render: (h, params) => {
-            return h(
-              "div",
-              this.$options.filters.unitPrice(params.row.commissionPrice, "￥")
-            );
-          },
-        },
-        {
-          title: "平台优惠券",
-          key: "siteCouponPrice",
-          render: (h, params) => {
-            if (params.row.siteCouponPrice == null) {
-              return h("div", "-");
-            } else {
-              return h(
-                "div",
-                this.$options.filters.unitPrice(
-                  params.row.siteCouponPrice,
-                  "￥"
-                )
-              );
-            }
-          },
-        },
-        {
-          title: "平台优惠券补贴金额",
-          key: "siteCouponCommission",
-          render: (h, params) => {
-            if (params.row.siteCouponCommission == null) {
-              return h("div", "-");
-            } else {
-              return h(
-                "div",
-                this.$options.filters.unitPrice(
-                  params.row.siteCouponCommission,
-                  "￥"
-                )
-              );
-            }
-          },
-        },
-        {
-          title: "分销金额",
-          key: "distributionRebate",
-          width: 120,
-          render: (h, params) => {
-            if (params.row.distributionRebate == null) {
-              return h("div", "-");
-            } else {
-              return h("priceColorScheme", {props:{value:params.row.distributionRebate,color:this.$mainColor}} );
-            }
-          },
-        },
-        {
-          title: "应结金额",
-          key: "billPrice",
-          width: 120,
-          render: (h, params) => {
-            return h("priceColorScheme", {props:{value:params.row.billPrice,color:this.$mainColor}} );
-          },
-        },
-      ],
-      refund: [], // 退款单
-      refundParam: {
-        // 请求参数
-        flowTypeEnum: "PAY",
-        pageNumber: 1, // 当前页数
-        pageSize: 10, // 页面大小
-        sort: "id", // 默认排序字段
-        order: "desc", // 默认排序方式
-        flowType: "REFUND",
-        startDate: null,
-        endDate: null,
-      },
-      refundColumns: [
-        // 退款单表头
-        {
-          title: "退款时间",
-          key: "createTime",
-          minWidth: 120,
-          tooltip: true,
-        },
-        {
-          title: "退款流水编号",
-          key: "sn",
-          minWidth: 120,
-          tooltip: true,
-        },
-        {
-          title: "订单编号",
-          key: "orderSn",
-          minWidth: 120,
-          tooltip: true,
-        },
-        {
-          title: "售后编号",
-          key: "refundSn",
-          minWidth: 120,
-          tooltip: true,
-        },
-        {
-          title: "退款金额",
-          key: "finalPrice",
-          width: 120,
-          render: (h, params) => {
-            return h("priceColorScheme", {props:{value:params.row.flowPfinalPricerice,color:this.$mainColor}} );
-          },
-
-        },
-        {
-          title: "退还佣金",
-          key: "commissionPrice",
-          minWidth: 120,
-          render: (h, params) => {
-            return h(
-              "div",
-              this.$options.filters.unitPrice(params.row.commissionPrice, "￥")
-            );
-          },
-        },
-
-        {
-          title: "退还平台优惠券",
-          key: "siteCouponCommission",
-          minWidth: 110,
-        },
-        {
-          title: "退还分销",
-          key: "distributionRebate",
-          minWidth: 120,
-          render: (h, params) => {
-            if (params.row.distributionRebate == null) {
-              return h("div", "-");
-            } else {
-              return h(
-                "div",
-                this.$options.filters.unitPrice(
-                  params.row.distributionRebate,
-                  "￥"
-                )
-              );
-            }
-          },
-        },
-
-        {
-          title: "合计金额",
-          key: "billPrice",
-          minWidth: 120,
-          render: (h, params) => {
-            if (params.row.billPrice == null) {
-              return h("div", "-");
-            } else {
-              return h(
-                "div",
-                this.$options.filters.unitPrice(params.row.billPrice, "￥")
-              );
-            }
-          },
-        },
       ],
       orderTotal: 0, // 订单总数
       refundTotal: 0, // 退款单总数
+      // 结算单状态枚举模拟数据
+      billStatusList: [
+        { status: 'OUT', value: '已出账', title: '生成账单' },
+        { status: 'CHECK', value: '已对账', title: '商家对账' },
+        { status: 'PAY', value: '已付款', title: '平台付款' },
+        { status: 'COMPLETE', value: '已完成', title: '结算完成' },
+      ],
+      // 结算单状态步骤
+      billStatusStep: []
     };
   },
   methods: {
+    // 结算单状态
+    getBillStatusStep() {
+      this.billStatusStep = [];
+      let current = '', myCur = false, myIdx = 0;
+      this.billStatusList.map((item, index) => {
+        if (item.status === this.bill.billStatus) {
+          myCur = true; myIdx = index; current = '';
+        } else {
+          if (!myCur) {
+            current = '';
+          } else {
+            if (myIdx+1 === index) {
+              current = 'current';
+            } else {
+              current = 'future';
+            }
+          }
+        }
+        let temp = { ...item, className: current };
+        this.billStatusStep.push (temp);
+      });
+      if (this.bill.billStatus === 'COMPLETE') {
+        this.billStatusStep[this.billStatusStep.length-1].className = 'current';
+      }
+    },
     //订单页数发生变化
     orderChangePage(v) {
       this.orderParam.pageNumber = v;
@@ -420,33 +501,49 @@ export default {
       this.orderParam.pageSize = v;
       this.getOrder();
     },
-    //退款单页数发生变化
-    refundOrderChangePage(v) {
-      this.refundParam.pageNumber = v;
-      this.getRefund();
-    },
-    //退款单每页条数变化
-    refundOrderChangePageSize(v) {
-      this.refundParam.pageSize = v;
-      tthis.getRefund();
-    },
-    clickTabs(index) {
-      this.orderParam.pageNumber = 1
-      if (index == 1) {
-        this.orderParam.flowType = "REFUND";
-        this.getRefund();
-      } else {
-        this.orderParam.flowType = "PAY";
-        this.getOrder();
-      }
-    },
-
+    //平台审核通过（审核通过及付款)
     pass() {
-      API_Shop.pay(this.id).then((res) => {
-        if (res.success) {
-          this.$Message.success(res.message);
-          this.init();
+      this.$Modal.confirm({
+        title: "结算单付款",
+        // 记得确认修改此处
+        content: "确定结算单已付款?",
+        loading: true,
+        onOk: () => {
+          API_Shop.pay(this.id).then((res) => {
+            if (res.success) {
+              this.$Message.success(res.message);
+              this.init();
+            }
+          });
+        },
+      });
+
+
+    },
+    //下载账单
+    download() {
+      API_Shop.downloadBill(this.id).then((res) => {
+        const blob = new Blob([res], {
+          type: "application/vnd.ms-excel;charset=utf-8",
+        });
+        //对于<a>标签，只有 Firefox 和 Chrome（内核） 支持 download 属性
+        //IE10以上支持blob但是依然不支持download
+        if ("download" in document.createElement("a")) {
+          //支持a标签download的浏览器
+          const link = document.createElement("a"); //创建a标签
+          link.download = "结算单-"+this.id+".xls"; //a标签添加属性
+          link.style.display = "none";
+          link.href = URL.createObjectURL(blob);
+          document.body.appendChild(link);
+          link.click(); //执行下载
+          URL.revokeObjectURL(link.href); //释放url
+          document.body.removeChild(link); //释放标签
+        } else {
+          navigator.msSaveBlob(blob, fileName);
         }
+      })
+        .catch((err) => {
+          console.log(err);
       });
     },
 
@@ -463,62 +560,65 @@ export default {
           //初始化订单信息
           this.orderParam.startDate = this.bill.startTime;
           this.orderParam.endDate = this.bill.endTime;
-          this.refundParam.startDate = this.bill.startTime;
-          this.refundParam.endDate = this.bill.endTime;
           this.getOrder();
+          // 结算单状态步骤
+          this.getBillStatusStep();
         }
       });
     },
+    // 账单详细
     initTable() {
       let bill = this.bill;
-      this.data[0].name = "结算单号";
-      this.data[0].value = bill.sn;
 
-      this.data[1].name = "起止日期";
-      this.data[1].value = bill.startTime + "~" + bill.endTime;
+      this.data[0].name = "结算单状态";
+      this.data[0].value = filters.unixSellerBillStatus(bill.billStatus);
 
-      this.data[2].name = "出帐日期";
-      this.data[2].value = bill.createTime;
+      this.data[1].name = "结算单号";
+      this.data[1].value = bill.sn;
 
-      this.data[3].name = "当前状态";
-      this.data[3].value = filters.unixSellerBillStatus(bill.billStatus);
+      this.data[2].name = "店铺名称";
+      this.data[2].value = bill.storeName;
 
-      this.data[4].name = "当前店铺";
-      this.data[4].value = bill.storeName;
+      this.data[3].name = "起止日期";
+      this.data[3].value = bill.startTime + "~" + bill.endTime;
 
-      this.data[5].name = "平台打款时间";
-      this.data[5].value = bill.payTime === null ? "未付款" : bill.payTime;
-      this.data[6].name = "订单付款总金额";
-      this.data[6].value = filters.unitPrice(
-        bill.orderPrice ? bill.orderPrice : 0,
-        "¥"
-      );
-      this.data[7].name = "结算金额";
-      this.data[7].value = filters.unitPrice(
-        bill.billPrice ? bill.billPrice : 0,
-        "¥"
-      );
+      this.data[4].name = "银行开户名";
+      this.data[4].value = bill.bankAccountName;
+
+      this.data[5].name = "银行账号";
+      this.data[5].value = bill.bankAccountNumber;
+
+      this.data[6].name = "开户行支行名称";
+      this.data[6].value = bill.bankName;
+
+      this.data[7].name = "支行联行号";
+      this.data[7].value = bill.bankCode;
+
+      this.data[8].name = "支付时间";
+      this.data[8].value = bill.payTime === null ? "未付款" : bill.payTime;
+
+      this.billData[0].billPrice = this.bill.billPrice;
+      this.billData[0].orderPrice = this.bill.orderPrice;
+      this.billData[0].siteCouponCommission = this.bill.siteCouponCommission;
+      this.billData[0].pointSettlementPrice = this.bill.pointSettlementPrice;
+      this.billData[0].kanjiaSettlementPrice = this.bill.kanjiaSettlementPrice;
+      this.billData[0].distributionCommission = this.bill.distributionCommission;
+      this.billData[0].commissionPrice = this.bill.commissionPrice;
+      this.billData[0].refundPrice = this.bill.refundPrice;
+      this.billData[0].siteCouponRefundCommission = this.bill.siteCouponRefundCommission;
+      this.billData[0].pointRefundSettlementPrice = this.bill.pointRefundSettlementPrice;
+      this.billData[0].kanjiaRefundSettlementPrice = this.bill.kanjiaRefundSettlementPrice;
+      this.billData[0].distributionRefundCommission = this.bill.distributionRefundCommission;
+      this.billData[0].refundCommissionPrice = this.bill.refundCommissionPrice;
     },
     getOrder() {
       API_Shop.getStoreFlow(this.id, this.orderParam).then((res) => {
         if (res.result) {
-          this.order = res.result.records;
+          this.orderData = res.result.records;
           this.orderTotal = res.result.total;
         }
       });
-      this.orderTotal = this.order.length;
-    },
-    getRefund() {
-      API_Shop.getStoreFlow(this.id, this.orderParam).then((res) => {
-        this.loading = false;
-        if (res.result) {
-          this.refund = res.result.records;
-          this.refundTotal = res.result.total;
-
-          this.$set(this, "refund", res.result.records);
-        }
-      });
-      this.refundTotal = this.refund.length;
+      this.orderTotal = this.orderData.length;
     },
   },
   mounted() {
@@ -531,52 +631,99 @@ export default {
 .flex {
   justify-content: space-between;
   flex-wrap: wrap;
+
   > p {
     width: 50%;
     margin: 15px 0;
   }
 }
+
 .tips-status {
   padding: 10px;
   font-size: 14px;
+
   > span {
     font-weight: bold;
     margin-right: 8px;
   }
+
   > span:nth-of-type(2) {
     color: $theme_color;
   }
 }
+
 table {
   font-size: 14px;
   margin-left: 40px;
+
   tr {
     font-size: 12px;
     height: 40px;
     padding: 10px;
+
     td:nth-child(1) {
       width: 120px;
     }
   }
 }
+
 .bill-detail-price {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   padding: 10px;
+
   > span {
     font-size: 14px;
     text-align: center;
     width: 200px;
     margin-bottom: 20px;
   }
+
   .increase-color {
     color: green;
-    margin-top:5px
-  }
-  .theme_color {
-    margin-top:5px
+    margin-top: 5px
   }
 
+  .theme_color {
+    margin-top: 5px
+  }
+}
+
+.procedure {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  font-size: 14px;
+  font-weight: bold;
+  margin: 12px 0 12px 20px;
+  .procedure_item {
+    width: 160px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    .icon {
+      width: 24px;
+      height: 24px;
+      text-align: center;
+      line-height: 24px;
+      border-radius: 50%;
+      margin-right: 14px;
+      font-weight: normal;
+      background-color: #e6f7ff;
+      color: #1890ff;
+    }
+    .current {
+      background-color: #2d8cf0;
+      color: #ffffff;
+    }
+    .future {
+      background-color: #f7f7f7;
+      color: #515a6e;
+    }
+    .text {
+
+    }
+  }
 }
 </style>
diff --git a/seller/src/api/shops.js b/seller/src/api/shops.js
index f7f4f412..c5c2f695 100644
--- a/seller/src/api/shops.js
+++ b/seller/src/api/shops.js
@@ -26,6 +26,10 @@ export const getSellerFlow = (id, params) => {
 export const reconciliation = (id, params) => {
   return putRequest(`/order/bill/check/${id}/`, params)
 }
+//根据id获取店铺信息
+export const downloadBill = (id) => {
+  return getRequest(`/order/bill/downLoad/${id}`, {}, 'blob')
+}
 
 // 获取商家分销订单流水分页
 export const getDistributionFlow = (id, params) => {
diff --git a/seller/src/views/shop/bill/billDetail.vue b/seller/src/views/shop/bill/billDetail.vue
index 04317332..9b92d307 100644
--- a/seller/src/views/shop/bill/billDetail.vue
+++ b/seller/src/views/shop/bill/billDetail.vue
@@ -1,102 +1,54 @@
 <template>
   <div class="bill-detail">
+
     <Card>
-      <p slot="title">商家信息</p>
+      <p slot="title">结算单详情</p>
       <div class="flex flex_align_item">
-        <p>店铺名称：{{ bill.storeName }}</p>
-        <p>银行开户名：{{ bill.bankAccountName }}</p>
-        <p>银行账号：{{ bill.bankAccountNumber }}</p>
-        <p>开户行支行名称：{{ bill.bankName }}</p>
-        <p>支行联行号：{{ bill.bankCode }}</p>
+        <div class="procedure">
+          <div class="procedure_item" v-for="(item, index) in billStatusStep">
+            <div class="icon" :class="item.className">
+              <Icon type="md-checkmark" size="14" v-if="item.className==='' || bill.billStatus === 'COMPLETE'" />
+              <span v-else>{{index + 1}}</span>
+            </div>
+            <div class="text">{{item.title}}</div>
+          </div>
+        </div>
+        <div>
+          <Button type="info" @click="download()" style="margin-left: 10px;">下载账单</Button>
+          <Button v-if="bill.billStatus == 'OUT'" @click="reconciliation()" type="success" style="margin-left: 10px;">对账</Button>
+        </div>
+
       </div>
+
     </Card>
+
     <Card class="mt_10">
       <p slot="title">账单详细</p>
-
-      <div class="tips-status">
-        <span>账单状态</span>
-
-        <span class="theme_color">{{
-          bill.billStatus | unixSellerBillStatus
-        }}</span>
-
-        <Button v-if="bill.billStatus == 'OUT'" size="mini" @click="reconciliation()" type="primary">对账</Button>
-      </div>
       <table>
         <tbody>
-          <tr v-for="(item,index) in data" :key="index">
-            <td>{{item.name}}</td>
-            <td>{{item.value}}</td>
-          </tr>
+        <tr v-for="(item,index) in data" :key="index">
+          <td>{{ item.name }}</td>
+          <td>{{ item.value }}</td>
+        </tr>
         </tbody>
       </table>
       <div>
         <h3 class="ml_10">结算详细</h3>
+        <Table :columns="billColumns" :data="billData"></Table>
         <div class="bill-detail-price">
           <div class="flex bill-item">
-            <span>
-              <p>退单金额</p>
-              <p class="theme_color">-{{bill.refundPrice || 0 | unitPrice('￥')}}</p>
-            </span>
-            <span>
-              <p>平台收取佣金</p>
-              <p class="theme_color">-{{bill.commissionPrice || 0 | unitPrice('￥')}}</p>
-            </span>
-            <span>
-              <p>分销返现支出</p>
-              <p class="theme_color">-{{bill.distributionCommission || 0  | unitPrice('￥')}}</p>
-            </span>
-            <span>
-              <p>退单平台优惠券补贴返还</p>
-              <p class="theme_color">-{{bill.siteCouponRefundCommission || 0  | unitPrice('￥')}}</p>
-            </span>
-             </div>
-            <div class="flex bill-item">
-            <span>
-              <p>平台优惠券补贴</p>
-              <p class="increase-color">+{{bill.siteCouponCommission || 0  | unitPrice('￥')}}</p>
-            </span>
-              <span>
-        		    <p>退单产生退还佣金金额</p>
-        		    <p class="increase-color">+{{bill.refundCommissionPrice || 0  | unitPrice('￥')}}</p>
-        		  </span>
-        		  <span>
-        		    <p>退单分销返现返还</p>
-        		    <p class="increase-color">+{{bill.distributionRefundCommission || 0  | unitPrice('￥')}}</p>
-        		  </span>
-            <span>
-              <p>积分结算金额</p>
-              <p class="increase-color">+{{bill.pointSettlementPrice || 0  | unitPrice('￥')}}</p>
-            </span>
-            <span>
-              <p>砍价商品结算金额</p>
-              <p class="increase-color">+{{bill.kanjiaSettlementPrice || 0  | unitPrice('￥')}}</p>
-            </span>
-            </div>
           </div>
         </div>
+      </div>
     </Card>
     <Card class="mt_10">
-      <Tabs active-key="tab" type="card" @on-click="clickTabs">
-        <Tab-pane label="订单列表" name="order">
+      <Tabs active-key="tab" type="card">
+        <Tab-pane label="结算单流水" name="order">
           <Table :loading="loading" border :columns="orderColumns" :data="orderData" ref="table"></Table>
           <Row type="flex" justify="end" class="mt_10">
-            <Page :current="orderParam.pageNumber" :total="orderTotal" :page-size="orderParam.pageSize" @on-change="orderChangePage" @on-page-size-change="orderChangePageSize" size="small" show-total
-              show-elevator></Page>
-          </Row>
-        </Tab-pane>
-        <Tab-pane label="退单列表" name="refund">
-          <Table :loading="loading" border :columns="refundColumns" :data="refundData" ref="table"></Table>
-          <Row type="flex" justify="end" class="mt_10">
-            <Page :current="refundParam.pageNumber" :total="refundTotal" :page-size="refundParam.pageSize" @on-change="refundChangePage" @on-page-size-change="refundChangePageSize" size="small"
-              show-total show-elevator></Page>
-          </Row>
-        </Tab-pane>
-        <Tab-pane label="分销费用列表" name="distribution">
-          <Table :loading="loading" border :columns="distributionColumns" :data="distributionData" ref="table"></Table>
-          <Row type="flex" justify="end" class="mt_10">
-            <Page :current="distributionParam.pageNumber" :total="distributionTotal" :page-size="distributionParam.pageSize" @on-change="distributionChangePage"
-              @on-page-size-change="distributionChangePageSize" size="small" show-total show-elevator></Page>
+            <Page :current="orderParam.pageNumber" :total="orderTotal" :page-size="orderParam.pageSize"
+                  @on-change="orderChangePage" @on-page-size-change="orderChangePageSize" size="small" show-total
+                  show-elevator></Page>
           </Row>
         </Tab-pane>
       </Tabs>
@@ -106,11 +58,174 @@
 <script>
 import * as filters from "@/utils/filters";
 import * as API_Shop from "@/api/shops";
+
 export default {
   name: "bill-detail",
   data() {
     return {
       loading: true,
+      billColumns: [
+        {
+          title: '结算金额',
+          key: 'billPrice',
+          align: 'center',
+          width: 200,
+          fixed: 'left',
+          render: (h, params) => {
+            return h(
+              "div",
+              this.$options.filters.unitPrice(params.row.billPrice, "￥")
+            );
+          },
+        },
+        {
+          title: '收入',
+          key: 'pay',
+          align: 'center',
+          children: [
+            {
+              title: '用户实付',
+              key: 'orderPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.orderPrice, "￥")
+                );
+              },
+            }, {
+              title: '平台优惠券补贴',
+              key: 'siteCouponCommission',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.siteCouponCommission, "￥")
+                );
+              },
+            }, {
+              title: '积分商品补贴',
+              key: 'pointSettlementPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.pointSettlementPrice, "￥")
+                );
+              },
+            }, {
+              title: '砍价商品补贴',
+              key: 'kanjiaSettlementPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.kanjiaSettlementPrice, "￥")
+                );
+              },
+            }, {
+              title: '分销佣金',
+              key: 'distributionCommission',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {props: {value: (0-params.row.distributionCommission), color: this.$mainColor}});
+              },
+            }, {
+              title: '平台服务费',
+              key: 'commissionPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {props: {value: (0-params.row.commissionPrice), color: this.$mainColor}});
+              },
+            },
+          ]
+        },
+        {
+          title: '退款',
+          key: 'refund',
+          align: 'center',
+          children: [
+            {
+              title: '退款金额',
+              key: 'refundPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {props: {value: (0-params.row.refundPrice), color: this.$mainColor}});
+              },
+            }, {
+              title: '退单返还平台优惠券补贴',
+              key: 'siteCouponRefundCommission',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {props: {value: (0-params.row.siteCouponRefundCommission), color: this.$mainColor}});
+              },
+            }, {
+              title: '退单返还积分商品补贴',
+              key: 'pointRefundSettlementPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {props: {value: (0-params.row.pointRefundSettlementPrice), color: this.$mainColor}});
+              },
+            }, {
+              title: '退单返还砍价商品补贴',
+              key: 'kanjiaRefundSettlementPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h("priceColorScheme", {props: {value: (0-params.row.kanjiaRefundSettlementPrice), color: this.$mainColor}});
+              },
+            }, {
+              title: '退单返还分销佣金',
+              key: 'distributionRefundCommission',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.distributionRefundCommission, "￥")
+                );
+              },
+            }, {
+              title: '退单返还平台服务费',
+              key: 'refundCommissionPrice',
+              align: 'center',
+              width: 200,
+              render: (h, params) => {
+                return h(
+                  "div",
+                  this.$options.filters.unitPrice(params.row.refundCommissionPrice, "￥")
+                );
+              },
+            },
+          ]
+        },
+      ],
+      billData: [
+        {
+          billPrice: 0,
+          orderPrice: 0,
+          siteCouponCommission: 0,
+          pointSettlementPrice: 0,
+          kanjiaSettlementPrice: 0,
+          distributionCommission: 0,
+          commissionPrice: 0,
+          refundPrice: 0,
+          siteCouponRefundCommission: 0,
+          pointRefundSettlementPrice: 0,
+          kanjiaRefundSettlementPrice: 0,
+          distributionRefundCommission: 0,
+          refundCommissionPrice: 0
+        },
+      ],
       columns: [
         {
           title: "项目",
@@ -165,308 +280,171 @@ export default {
         pageSize: 10, // 页面大小
         sort: "id", // 默认排序字段
         order: "desc", // 默认排序方式
-        flowType: "PAY",
+
       },
       orderColumns: [
         {
-          title: "入账时间",
-          key: "createTime",
+          title: '结算信息',
+          key: 'pay',
+          align: 'center',
+          children: [
+            {
+              title: "时间",
+              key: "createTime",
+            },
+            {
+              title: "订单编号",
+              key: "orderSn",
+              width: 250,
+            },
+            {
+              title: "子订单号",
+              key: "orderItemSn",
+              width: 250,
+            },
+            {
+              title: "类型",
+              key: "flowType",
+              render: (h, params) => {
+                if (params.row.flowType == "PAY") {
+                  return h("div", [
+                    h("tag", {props: {color: "blue"}}, "收款"),
+                  ]);
+                }else{
+                  return h("div", [
+                    h("tag", {props: {color: "magenta"}}, "退款"),
+                  ]);
+                }
+              }
+            },
+            {
+              title: "结算金额",
+              key: "billPrice",
+              render: (h, params) => {
+                if(params.row.flowType == "PAY"){
+                  return h("div", this.$options.filters.unitPrice(params.row.billPrice, "￥")
+                  );
+                }else{
+                  return h("priceColorScheme", {props: {value: (0-params.row.finalPrice), color: this.$mainColor}});
+                }
+              },
+            },
+          ]
         },
         {
-          title: "订单编号",
-          key: "orderSn",
-        },
-        {
-          title: "订单金额",
-          key: "finalPrice",
-          render: (h, params) => {
-            return h("priceColorScheme", {props:{value:params.row.finalPrice,color:this.$mainColor}} );
+          title: '收入',
+          key: 'pay',
+          align: 'center',
+          children: [{
+            title: "补贴",
+            key: "billPrice",
+            render: (h, params) => {
+              if (params.row.pointSettlementPrice == 0) {
+                return h("div", "-");
+              }else if(params.row.flowType == "PAY"){
+                return h("div", this.$options.filters.unitPrice((params.row.pointSettlementPrice+params.row.kanjiaSettlementPrice+params.row.siteCouponCommission) , "￥")
+                );
+              }else{
+                return h("priceColorScheme", {props: {value: (0-(params.row.pointSettlementPrice+params.row.kanjiaSettlementPrice+params.row.siteCouponCommission))}});
+              }
+            },
           },
+            {
+              title: "用户实付",
+              key: "billPrice",
+              render: (h, params) => {
+                if(params.row.flowType == "PAY"){
+                  return h("div", this.$options.filters.unitPrice(params.row.siteCouponCommission, "￥")
+                  );
+                }else{
+                  return h("priceColorScheme", {props: {value: (0-params.row.siteCouponCommission)}});
+                }
+              },
+            },
+            {
+              title: "合计",
+              key: "billPrice",
+              render: (h, params) => {
+                if(params.row.flowType == "PAY"){
+                  return h("div", this.$options.filters.unitPrice(params.row.finalPrice, "￥")
+                  );
+                }else{
+                  return h("priceColorScheme", {props: {value: (0-params.row.billPrice)}});
+                }
+              },
+            },
+          ]
         },
         {
-          title: "砍价商品结算价格",
-          key: "kanjiaSettlementPrice",
-          render: (h, params) => {
-            if (params.row.kanjiaSettlementPrice) {
-              return h("priceColorScheme", {props:{value:params.row.kanjiaSettlementPrice,color:this.$mainColor}} );
-            } else {
-              return h("div", "￥0.00");
-            }
+          title: '支出',
+          key: 'pay',
+          align: 'center',
+          children: [{
+            title: "平台服务费",
+            key: "billPrice",
+            render: (h, params) => {
+              if (params.row.commissionPrice == 0) {
+                return h("div", "-");
+              }else if(params.row.flowType == "PAY"){
+                return h("div", this.$options.filters.unitPrice(params.row.commissionPrice, "￥")
+                );
+              }else{
+                return h("priceColorScheme", {props: {value: (0-params.row.commissionPrice)}});
+              }
+            },
           },
-        },
-        {
-          title: "积分商品结算价格",
-          key: "pointSettlementPrice",
-          render: (h, params) => {
-            if (params.row.pointSettlementPrice) {
-              return h(
-                "div",
-                this.$options.filters.unitPrice(
-                  params.row.pointSettlementPrice,
-                  "￥"
-                )
-              );
-            } else {
-              return h("div", "￥0.00");
-            }
-          },
-        },
-        {
-          title: "平台分佣",
-          key: "commissionPrice",
-          render: (h, params) => {
-            return h(
-              "div",
-              this.$options.filters.unitPrice(params.row.commissionPrice, "￥")
-            );
-          },
-        },
-        {
-          title: "平台优惠券",
-          key: "siteCouponPrice",
-          render: (h, params) => {
-            if (params.row.siteCouponPrice == null) {
-              return h("div", "-");
-            } else {
-              return h(
-                "div",
-                this.$options.filters.unitPrice(
-                  params.row.siteCouponPrice,
-                  "￥"
-                )
-              );
-            }
-          },
-        },
-		{
-		  title: "平台优惠券补贴金额",
-		  key: "siteCouponCommission",
-		  render: (h, params) => {
-		    if(params.row.siteCouponCommission == null){
-		      return h(
-		        "div",
-		        "-"
-		      );
-		    }else{
-		      return h(
-		        "div",
-		        this.$options.filters.unitPrice(params.row.siteCouponCommission, "￥")
-		      );
-		    }
+            {
+              title: "分销佣金",
+              key: "distributionRebate",
+              render: (h, params) => {
+                if (params.row.distributionRebate == 0) {
+                  return h("div", "-");
+                } else if(params.row.flowType == "PAY"){
+                  return h("div", this.$options.filters.unitPrice(params.row.distributionRebate, "￥")
+                  );
+                }else{
+                  return h("priceColorScheme", {props: {value: (0-params.row.distributionRebate)}});
+                }
+
+                // if (params.row.distributionRebate == null) {
+                //   return h("div", "-");
+                // } else {
+                //   return h(
+                //     "div",
+                //     this.$options.filters.unitPrice(
+                //       params.row.distributionRebate,
+                //       "￥"
+                //     )
+                //   );
+                // }
+              },
+            },
+            {
+              title: "合计",
+              key: "billPrice",
+              render: (h, params) => {
+                if(params.row.flowType == "PAY"){
+                  return h("div", this.$options.filters.unitPrice((params.row.commissionPrice+params.row.distributionRebate), "￥")
+                  );
+                }else{
+                  return h("priceColorScheme", {props: {value: (0-(params.row.commissionPrice+params.row.distributionRebate))}});
+                }
+              },
+            }]
+        }
 
-		  },
-		},
-        {
-          title: "分销金额",
-          key: "distributionRebate",
-          render: (h, params) => {
-            if (params.row.distributionRebate == null) {
-              return h("div", "-");
-            } else {
-              return h(
-                "div",
-                this.$options.filters.unitPrice(
-                  params.row.distributionRebate,
-                  "￥"
-                )
-              );
-            }
-          },
-        },
-        {
-          title: "应结金额",
-          key: "billPrice",
-          render: (h, params) => {
-            return h(
-              "div",
-              this.$options.filters.unitPrice(params.row.billPrice, "￥")
-            );
-          },
-        },
       ],
       orderData: [], // 订单列表
       orderTotal: 0, // 订单数量
-      //退单部分
-      refundParam: {
-        pageNumber: 1, // 当前页数
-        pageSize: 10, // 页面大小
-        sort: "id", // 默认排序字段
-        order: "desc", // 默认排序方式
-        flowType: "REFUND",
-      },
-      refundColumns: [
-        {
-          title: "退款时间",
-          key: "createTime",
-          minWidth: 120,
-        },
-        {
-          title: "退款流水编号",
-          key: "sn",
-          minWidth: 120,
-          tooltip: true
-        },
-        {
-          title: "订单编号",
-          key: "orderSn",
-          minWidth: 120,
-          tooltip: true
-        },
-        {
-          title: "售后编号",
-          key: "refundSn",
-          minWidth: 120,
-          tooltip: true
-        },
-        {
-          title: "退款金额",
-          key: "finalPrice",
-          minWidth: 120,
-          render: (h, params) => {
-            return h(
-              "div",
-              this.$options.filters.unitPrice(params.row.finalPrice, "￥")
-            );
-          },
-        },
-        {
-          title: "退还佣金",
-          key: "commissionPrice",
-          minWidth: 120,
-          render: (h, params) => {
-            if (params.row.commissionPrice) {
-              return h(
-                "div",
-                this.$options.filters.unitPrice(
-                  params.row.commissionPrice,
-                  "￥"
-                )
-              );
-            } else {
-              return h("div", this.$options.filters.unitPrice(0, "￥"));
-            }
-          },
-        },
-
-        {
-          title: "退还平台优惠券",
-          key: "siteCouponCommission",
-          minWidth: 140,
-        },
-        {
-          title: "退还分销",
-          key: "distributionRebate",
-          minWidth: 120,
-          render: (h, params) => {
-            if (params.row.distributionRebate == null) {
-              return h("div", "-");
-            } else {
-              return h(
-                "div",
-                this.$options.filters.unitPrice(
-                  params.row.distributionRebate,
-                  "￥"
-                )
-              );
-            }
-          },
-        },
-
-        {
-          title: "合计金额",
-          key: "billPrice",
-          minWidth: 120,
-          render: (h, params) => {
-            if (params.row.billPrice == null) {
-              return h("div", "-");
-            } else {
-              return h(
-                "div",
-                this.$options.filters.unitPrice(params.row.billPrice, "￥")
-              );
-            }
-          },
-        },
+      // 结算单状态枚举模拟数据
+      billStatusList: [
+        { status: 'OUT', value: '已出账', title: '生成账单' },
+        { status: 'CHECK', value: '已对账', title: '商家对账' },
+        { status: 'PAY', value: '已付款', title: '平台付款' },
+        { status: 'COMPLETE', value: '已完成', title: '结算完成' },
       ],
-      refundData: [], // 退单数据
-      refundTotal: 0, // 退单数量
-      //分销佣金部分
-      distributionParam: {
-        pageNumber: 1, // 当前页数
-        pageSize: 10, // 页面大小
-        sort: "id", // 默认排序字段
-        order: "desc", // 默认排序方式
-      },
-      distributionColumns: [
-        {
-          title: "订单编号",
-          key: "sn",
-          minWidth: 120,
-        },
-        {
-          title: "交易金额",
-          key: "finalPrice",
-          minWidth: 120,
-        },
-        {
-          title: "商品名称",
-          key: "goodsName",
-          minWidth: 120,
-          tooltip: true,
-        },
-        {
-          title: "规格",
-          key: "finalPrice",
-          minWidth: 120,
-          render: (h, params) => {
-            return h(
-              "div",
-              this.$options.filters.unitPrice(params.row.finalPrice, "￥")
-            );
-          },
-        },
-        {
-          title: "店铺名称",
-          key: "storeName",
-          minWidth: 120,
-        },
-
-        {
-          title: "佣金",
-          key: "distributionRebate",
-          minWidth: 120,
-          render: (h, params) => {
-            if (params.row.flowType === "退款") {
-              return h(
-                "div",
-                this.$options.filters.unitPrice(
-                  "-" + params.row.distributionRebate,
-                  "￥"
-                )
-              );
-            } else {
-              if (params.row.distributionRebate) {
-                return h(
-                  "div",
-                  this.$options.filters.unitPrice(
-                    params.row.distributionRebate,
-                    "￥"
-                  )
-                );
-              } else {
-                return h("div", this.$options.filters.unitPrice(0, "￥"));
-              }
-            }
-          },
-        },
-        {
-          title: "时间",
-          key: "createTime",
-          minWidth: 120,
-        },
-      ],
-      distributionData: [], // 分销数据
-      distributionTotal: 0, // 分销总数
+      // 结算单状态步骤
+      billStatusStep: []
     };
   },
   watch: {
@@ -476,15 +454,29 @@ export default {
     },
   },
   methods: {
-    clickTabs(v) {
-      if (v == "order") {
-        this.orderParam.flowType = "PAY";
-        this.getOrderList();
-      } else if (v === "refund") {
-        this.orderParam.flowType = "REFUND";
-        this.getRefundList();
-      } else {
-        this.getDistributionList();
+    // 结算单状态
+    getBillStatusStep() {
+      this.billStatusStep = [];
+      let current = '', myCur = false, myIdx = 0;
+      this.billStatusList.map((item, index) => {
+        if (item.status === this.bill.billStatus) {
+          myCur = true; myIdx = index; current = '';
+        } else {
+          if (!myCur) {
+            current = '';
+          } else {
+            if (myIdx+1 === index) {
+              current = 'current';
+            } else {
+              current = 'future';
+            }
+          }
+        }
+        let temp = { ...item, className: current };
+        this.billStatusStep.push (temp);
+      });
+      if (this.bill.billStatus === 'COMPLETE') {
+        this.billStatusStep[this.billStatusStep.length-1].className = 'current';
       }
     },
     //核对结算单
@@ -528,44 +520,6 @@ export default {
         }
       });
     },
-    //退单部分
-    refundChangePage(v) {
-      this.refundParam.pageNumber = v;
-      this.getRefundList();
-    },
-    refundChangePageSize(v) {
-      this.refundParam.pageSize = v;
-      this.getRefundList();
-    },
-    getRefundList() {
-      API_Shop.getSellerFlow(this.id, this.refundParam).then((res) => {
-        this.loading = false;
-        if (res.result) {
-          this.refundData = res.result.records;
-          this.refundTotal = res.result.total;
-        }
-      });
-    },
-    //分销费用列表
-    distributionChangePage(v) {
-      this.distributionParam.pageNumber = v;
-      this.getDistributionList();
-    },
-    distributionChangePageSize(v) {
-      this.distributionParam.pageSize = v;
-      this.getDistributionList();
-    },
-    getDistributionList() {
-      API_Shop.getDistributionFlow(this.id, this.distributionParam).then(
-        (res) => {
-          this.loading = false;
-          if (res.result) {
-            this.distributionData = res.result.records;
-            this.distributionTotal = res.result.total;
-          }
-        }
-      );
-    },
     //获取结算单详细
     getBill() {
       API_Shop.getBillDetail(this.id).then((res) => {
@@ -575,40 +529,78 @@ export default {
           this.initTable();
           //初始化订单信息
           this.getOrderList();
+          // 结算单状态步骤
+          this.getBillStatusStep();
         }
       });
     },
     // 账单详细
     initTable() {
       let bill = this.bill;
-      this.data[0].name = "结算单号";
-      this.data[0].value = bill.sn;
 
-      this.data[1].name = "起止日期";
-      this.data[1].value = bill.startTime + "~" + bill.endTime;
+      this.data[0].name = "结算单状态";
+      this.data[0].value = filters.unixSellerBillStatus(bill.billStatus);
 
-      this.data[2].name = "出帐日期";
-      this.data[2].value = bill.createTime;
+      this.data[1].name = "结算单号";
+      this.data[1].value = bill.sn;
 
-      this.data[3].name = "当前状态";
-      this.data[3].value = filters.unixSellerBillStatus(bill.billStatus);
+      this.data[2].name = "店铺名称";
+      this.data[2].value = bill.storeName;
 
-      this.data[4].name = "当前店铺";
-      this.data[4].value = bill.storeName;
+      this.data[3].name = "起止日期";
+      this.data[3].value = bill.startTime + "~" + bill.endTime;
 
-      this.data[5].name = "平台打款时间";
-      this.data[5].value = bill.payTime === null ? "未付款" : bill.payTime;
+      this.data[4].name = "银行开户名";
+      this.data[4].value = bill.bankAccountName;
 
-      this.data[6].name = "订单付款总金额";
-      this.data[6].value = filters.unitPrice(
-        bill.orderPrice ? bill.orderPrice : 0,
-        "¥"
-      );
-      this.data[7].name = "结算金额";
-      this.data[7].value = filters.unitPrice(
-        bill.billPrice ? bill.billPrice : 0,
-        "¥"
-      );
+      this.data[5].name = "银行账号";
+      this.data[5].value = bill.bankAccountNumber;
+
+      this.data[6].name = "开户行支行名称";
+      this.data[6].value = bill.bankName;
+
+      this.data[7].name = "支行联行号";
+      this.data[7].value = bill.bankCode;
+
+      this.billData[0].billPrice = this.bill.billPrice;
+      this.billData[0].orderPrice = this.bill.orderPrice;
+      this.billData[0].siteCouponCommission = this.bill.siteCouponCommission;
+      this.billData[0].pointSettlementPrice = this.bill.pointSettlementPrice;
+      this.billData[0].kanjiaSettlementPrice = this.bill.kanjiaSettlementPrice;
+      this.billData[0].distributionCommission = this.bill.distributionCommission;
+      this.billData[0].commissionPrice = this.bill.commissionPrice;
+      this.billData[0].refundPrice = this.bill.refundPrice;
+      this.billData[0].siteCouponRefundCommission = this.bill.siteCouponRefundCommission;
+      this.billData[0].pointRefundSettlementPrice = this.bill.pointRefundSettlementPrice;
+      this.billData[0].kanjiaRefundSettlementPrice = this.bill.kanjiaRefundSettlementPrice;
+      this.billData[0].distributionRefundCommission = this.bill.distributionRefundCommission;
+      this.billData[0].refundCommissionPrice = this.bill.refundCommissionPrice;
+    },
+    //下载账单
+    download() {
+      API_Shop.downloadBill(this.id).then((res) => {
+        const blob = new Blob([res], {
+          type: "application/vnd.ms-excel;charset=utf-8",
+        });
+        //对于<a>标签，只有 Firefox 和 Chrome（内核） 支持 download 属性
+        //IE10以上支持blob但是依然不支持download
+        if ("download" in document.createElement("a")) {
+          //支持a标签download的浏览器
+          const link = document.createElement("a"); //创建a标签
+          link.download = "结算单-"+this.id+".xls"; //a标签添加属性
+          link.style.display = "none";
+          link.href = URL.createObjectURL(blob);
+          document.body.appendChild(link);
+          link.click(); //执行下载
+          URL.revokeObjectURL(link.href); //释放url
+          document.body.removeChild(link); //释放标签
+        } else {
+          navigator.msSaveBlob(blob, fileName);
+        }
+      })
+        .catch((err) => {
+          console.log(err);
+        });
     },
   },
   mounted() {
@@ -621,6 +613,8 @@ export default {
     }
     next();
   },
+
+
 };
 </script>
 
@@ -628,58 +622,109 @@ export default {
 .flex {
   justify-content: space-between;
   flex-wrap: wrap;
+
   > p {
     width: 50%;
     margin: 15px 0;
   }
 }
+
 .page {
   margin-top: 10px;
 }
+
 .tips-status {
   padding: 10px;
   font-size: 14px;
+
   > span {
     font-weight: bold;
     margin-right: 8px;
   }
+
   > span:nth-of-type(2) {
     color: $theme_color;
   }
 }
+
 table {
   font-size: 14px;
   margin-left: 20px;
+
   tr {
     height: 40px;
     padding: 10px;
+
     td:nth-child(1) {
       width: 120px;
     }
   }
 }
+
 .bill-detail-price {
   width: 1200px;
   margin: 10px 0;
   padding: 10px;
+
   /deep/ span {
     font-size: 14px;
     text-align: center;
     width: 200px;
     margin-bottom: 10px;
   }
+
   .theme_color {
     color: $theme_color;
   }
+
   .increase-color {
     color: green;
   }
-  div{
 
-  margin: 20px 0;
+  div {
+
+    margin: 20px 0;
   }
 }
-.bill-item{
+
+.bill-item {
   justify-content: flex-start;
 }
+
+.procedure {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  font-size: 14px;
+  font-weight: bold;
+  margin: 12px 0 12px 20px;
+  .procedure_item {
+    width: 160px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    .icon {
+      width: 24px;
+      height: 24px;
+      text-align: center;
+      line-height: 24px;
+      border-radius: 50%;
+      margin-right: 14px;
+      font-weight: normal;
+      background-color: #e6f7ff;
+      color: #1890ff;
+    }
+    .current {
+      background-color: #2d8cf0;
+      color: #ffffff;
+    }
+    .future {
+      background-color: #f7f7f7;
+      color: #515a6e;
+    }
+    .text {
+
+    }
+  }
+}
 </style>