jufubao-admin-library 1.0.0-beta1

package/library/viewModules/viewsFinance/viewsFinance/balance/detail_partner.vue

@@ -0,0 +1,633 @@
+<template>
+  <div class="app-container">
+    <el-card class="app-container__search">
+      <div slot="header" class="flex list_header">
+        <div>加盟商明细对账</div>
+        <div class="flex total_wrap">
+          <p class="amount_wrap">
+            <span class="amount_label">总余额：</span
+            >{{ divide(totalData.total_amount) }}元
+          </p>
+          <el-link
+            v-permission="[roleWallet.correctPartnerAmount]"
+            type="primary"
+            @click="dialogShow = true"
+            >余额矫正</el-link
+          >
+        </div>
+      </div>
+      <xd-search
+        dateFilter
+        timeType
+        v-if="searchForm.length > 0"
+        v-model="searchParams"
+        :list="searchForm"
+        @onSearch="handleSearch"
+        @onDone="getList"
+      >
+        <template slot="time" slot-scope="scope">
+          <div>
+            <el-select v-model="channel_code" filterable clearable placeholder="请输入加盟商名称">
+              <el-option
+                v-for="item in channelList"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+            <el-select
+              clearable
+              v-if="channel_code&&showSupplier"
+              v-model="supplier_ids"
+              filterable
+              remote
+              reserve-keyword
+              placeholder="请输入关键词"
+              :remote-method="remoteMethod"
+            >
+              <el-option
+                v-for="item in supplierList"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+          </div>
+        </template>
+      </xd-search>
+    </el-card>
+    <el-card class="app-container__list">
+      <div class="app-container__list-pagination">
+        <div></div>
+        <div class="table-stat">
+          <p>
+            总充值：<span class="_mo"
+              >{{ divide(totalData.total_recharge_amount) }}元</span
+            >
+            提现总额：<span class="_mo"
+              >{{ divide(totalData.total_withdrawal_amount) }}元</span
+            >
+            矫正金额：<span class="_mo"
+              >{{ divide(totalData.correct_amount) }}元</span
+            >
+            总收入：<span class="_mo"
+              >{{ divide(totalData.total_income_amount) }}元</span
+            >
+            总消费：<span class="_mo"
+              >{{ divide(totalData.total_consume_amount) }}元</span
+            >
+            总退款：<span class="_mo"
+              >{{ divide(totalData.total_refund_amount) }}元</span
+            >
+            结余：<span class="_mo">{{ divide(totalData.cash_amount) }}元</span>
+            实际结算：<span class="_mo"
+              >{{ divide(totalData.settlement_amount) }}元</span
+            >
+          </p>
+          <el-button type="primary" @click="doExport">导出</el-button>
+        </div>
+      </div>
+      <div class="app-container__list-table">
+        <xd-table :headers="headers" :list="tables" is-border>
+          <template slot="products" slot-scope="scope">
+            <div
+              class="table-product"
+              v-for="(prod, i) in scope.row.product_list"
+              :key="i"
+            >
+              <div class="table-product__img">
+                <img :src="prod.product_thumb" alt="" />
+              </div>
+              <div class="table-product__name">
+                <p>{{ prod.product_name }}</p>
+                <p>{{ prod.product_sku_name }}</p>
+              </div>
+              <div class="table-product__id">
+                <p>{{ prod.product_id }}</p>
+              </div>
+              <div>
+                <p>
+                  {{
+                    `单价(${divide(prod.dist_price)})*数量(${
+                      prod.product_num
+                    })` +
+                    (prod.channel_pay_price
+                      ? `-补差(${divide(prod.channel_pay_price)})`
+                      : "")
+                  }}
+                </p>
+              </div>
+            </div>
+          </template>
+        </xd-table>
+      </div>
+      <div class="app-container__list-pagination">
+        <xd-pagination
+          :page="page_token"
+          :total="total"
+          :limit.sync="page_size"
+          :autoScroll="false"
+          @onPagination="handlePagination"
+        ></xd-pagination>
+      </div>
+    </el-card>
+    <xd-dialog
+      :show.sync="dialogShow"
+      width="350px"
+      title="请输入要调整的平台金额"
+      @onConfirm="handleCorrect"
+    >
+      <el-form :model="correctForm" :inline="true">
+        <el-form-item label="">
+          <el-select
+            style="width: 100px"
+            v-model="correctForm.correct_type"
+            placeholder="请选择"
+          >
+            <el-option label="上调" value="A"></el-option>
+            <el-option label="下调" value="R"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="">
+          <el-input
+            v-model="correctForm.amount"
+            type="number"
+            placeholder="请输入调整金额"
+          ></el-input>
+        </el-form-item>
+      </el-form>
+    </xd-dialog>
+    <xd-dialog
+      @onConfirm="handleExport"
+      :show.sync="showExport"
+      width="350px"
+      title="导出文件名称"
+    >
+      <el-input maxlength="20" v-model="exportName" placeholder=""></el-input>
+    </xd-dialog>
+  </div>
+</template>
+
+
+<script>
+import XdSearch from "@/components/XdSearch";
+import XdPagination from "@/components/XdPagination.vue";
+import XdTable from "@/components/XdTable";
+import { mapActions } from "vuex";
+import { getOptions } from "@/utils/options";
+import XdDialog from "@/components/XdDialog";
+import { baseJsDateToTime } from "@/utils/xd.base.js";
+import checkPermission from "@/utils/permission";
+import roleTRecord from "@/constant/modules/tradeRecord.js";
+import roleWallet from "@/constant/modules/wallet.js";
+
+export default {
+  name: "PagePartnerDetail",
+  components: {
+    XdPagination, //翻译插件
+    XdSearch, //搜查插件
+    XdTable,
+    XdDialog,
+  },
+  data() {
+    return {
+      roleWallet,
+
+      //分页参数
+      page_token: 1, //当前页面数量
+      hasNextPage: true, //是否有下一页
+      page_size: 20, //搜索参数
+      searchForm: [], //搜索区域模块表单
+      searchParams: null, //搜索参数
+      totalData: {},
+      total: 0,
+      categoryList: [],
+      dialogShow: false,
+      correctForm: {},
+
+      //列表对象
+      tables: [],
+      headers: [
+        {
+          type: "normal",
+          prop: "main_order_id",
+          align: "center",
+          width: 200,
+          label: "主单号",
+        },
+        {
+          type: "normal",
+          prop: "sub_order_id",
+          align: "center",
+          minWidth: 200,
+          label: "拆单号",
+        },
+        {
+          type: "normal",
+          prop: "products",
+          align: "center",
+          minWidth: 420,
+          label: "商品图片/名称/ID/公式",
+        },
+        // { "type": "normal", "prop": "category_name", "align": "center", "minWidth": 200, "label": "公式" },
+        {
+          type: "price",
+          prop: "amount",
+          align: "center",
+          width: 100,
+          label: "总价",
+          unit: "元",
+        },
+        {
+          type: "normal",
+          prop: "created_time",
+          align: "center",
+          minWidth: 200,
+          label: "下单时间",
+        },
+        {
+          type: "normal",
+          prop: "supplier_name",
+          align: "center",
+          minWidth: 200,
+          label: "供货商",
+        },
+        {
+          type: "normal",
+          prop: "operate_type_name",
+          align: "center",
+          minWidth: 100,
+          label: "资金方向",
+        },
+        {
+          type: "normal",
+          prop: "invoice_name",
+          align: "center",
+          minWidth: 200,
+          label: "发票名称",
+        },
+        {
+          type: "normal",
+          prop: "comment",
+          align: "center",
+          minWidth: 200,
+          label: "备注",
+        },
+      ],
+      showExport: false,
+      exportName: "加盟商明细",
+      channelList: [],
+      channel_code: null,
+      supplier_ids: null,
+      supplierList: [],
+      showSupplier: false
+    };
+  },
+  computed: {
+    partner_id() {
+      return this.$route.params.id;
+    },
+    wallet_type() {
+      return this.$route.query.wallet_type;
+    },
+    wallet_nnid() {
+      return this.$route.query.wallet_nnid;
+    },
+    partner_name() {
+      return this.$route.query.partner_name;
+    },
+  },
+  watch: {
+    channel_code(val) {
+      if (val) {
+        this.supplier_ids=null;
+        this.supplierList = []
+        this.showSupplier =  this.channelList.find(item => item.value === val).has_supplier==='Y';
+      }
+    },
+  },
+  created() {
+    this.initSearchForm();
+  },
+  methods: {
+    ...mapActions("tradeRecord", [
+      "listPartner",
+      "countPartner",
+      "getSupplierList",
+    ]),
+    ...mapActions("wallet", ["correctPartnerAmount"]),
+    handleCorrect() {
+      console.log(this.correctForm);
+      const { amount, correct_type } = this.correctForm;
+      if (!amount || !correct_type) {
+        return this.$message.error("请输入要调整的平台金额数据");
+      }
+      let postData = {
+        amount: this.$xdHelper.multiplyFloatNumber(amount, 100),
+        correct_type,
+        partner_id: this.partner_id,
+        wallet_type: this.wallet_type,
+        wallet_nnid: this.wallet_nnid,
+      };
+      let loading = this.$loading({});
+      this.correctPartnerAmount(postData)
+        .then((res) => {
+          loading.close();
+          this.$message.success("调整成功");
+          this.dialogShow = false;
+          this.getList();
+        })
+        .catch((err) => {
+          loading.close();
+        });
+    },
+    remoteMethod(query) {
+      if (query !== "") {
+        this.getSupplierList({ value: this.channel_code, keyword: query })
+          .then((res) => {
+            this.supplierList = res.data.list;
+          })
+          .catch((err) => {
+            console.log(err, "err");
+          });
+      } else {
+        this.supplierList = [];
+      }
+    },
+    //相除
+    divide(price) {
+      return this.$xdHelper.divisionFloatNumber(price, 100);
+    },
+    getParams() {
+      const { p_id, ...other } = this.searchParams;
+      let supplier_ids;
+      let channel_codes;
+      if (this.supplier_ids) {
+        supplier_ids = [];
+        supplier_ids.push(this.supplier_ids);
+      }
+      if(this.channel_code) {
+        channel_codes = []
+        channel_codes.push(this.channel_code)
+      }
+      return {
+        ...other,
+        supplier_ids,
+        channel_codes,
+        partner_id: this.partner_id,
+      };
+    },
+    doExport() {
+      this.exportName= "加盟商明细",
+      this.showExport = true;
+    },
+    handleExport() {
+      if(!this.exportName) {
+        this.$message.error('请输入导出名称');
+        return
+      }
+      const other = this.getParams();
+      let params = {
+        ...other,
+        export: true,
+        file_ext: "xlsx",
+        file_name: this.exportName,
+        export_data_tag: "ExportPartnerTradeRecordList",
+      };
+      let loading = this.$loading({});
+      this.listPartner(params)
+        .then((res) => {
+          loading.close();
+          this.showExport = false;
+          this.$alert(
+            "导出任务已经开始执行，请去任务管理查看下载状态",
+            "提示",
+            {
+              confirmButtonText: "确定",
+            }
+          );
+        })
+        .catch((err) => {
+          this.$message.error(err.msg);
+          loading.close();
+        });
+    },
+    /**
+     * @description 获取数据列表
+     */
+    getList() {
+      //请求数据
+      const other = this.getParams();
+      let params = {
+        ...other,
+        page_token: this.page_token,
+        page_size: this.page_size,
+      };
+      console.log(params);
+      let loading = this.$loading({});
+      Promise.all([this.listPartner(params), this.countPartner(params)])
+        .then(([res, res1]) => {
+          loading.close();
+          this.tables = res.data.list.map((item) => {
+            item["created_time"] = baseJsDateToTime(item["created_time"]);
+            item["product_list"] = item["product_list"].map((prod) => {
+              prod["product_thumb"] = this.getImageFullPath(
+                prod["product_thumb"]
+              );
+              return prod;
+            });
+            return item;
+          });
+          this.total = res.data.total_size;
+          this.totalData = res1.data;
+        })
+        .catch((err) => {
+          loading.close();
+        });
+    },
+
+    /**
+     * @description 点击搜索进行搜索操作
+     * @param action 动作
+     * @param form 搜索请求参数
+     */
+    handleSearch({ action, form }) {
+      if(action === "reset") {
+        this.supplier_ids=null
+        this.channel_code=null
+      }
+      this.page_token = 1;
+      this.getList();
+    },
+    /**
+     * @description 初始化搜索模块
+     */
+    initSearchForm() {
+      getOptions(
+        [
+          {
+            server: 'supplier-partner',
+            fn: 'supplier-channel',
+            path: 'p1',
+            params: {
+              type: this.wallet_type==='PF'?'MOVIE':'MALL'
+            }
+          },
+          {
+            server: 'finance-partner',
+            fn: 'wallet',
+            path: 'p1',
+            params: {
+              type: 'partner'
+            }
+          }
+        ]
+      ).then(res=>{
+          this.channelList = res[0].data.list;
+          this.searchForm = [
+            {
+              label: "加盟商",
+              ele: "el-input",
+              valueKey: "p_id",
+              value: this.partner_name || this.partner_id,
+              placeholder: "请输入名称",
+              disabled: true,
+            },
+            {
+              label: "账户类型",
+              ele: "xd-select-list",
+              valueKey: "wallet_type",
+              value: this.wallet_type,
+              placeholder: "请输入渠道ID",
+              disabled: true,
+              list: res[1].data.list_wallet_type,
+            },
+            {
+              label: "资金方向",
+              ele: "xd-select-list",
+              valueKey: "operate_type",
+              value: "",
+              placeholder: "请输入渠道ID",
+              list: [
+                { label: "全部", value: "" },
+                { label: "支出", value: "R" },
+                { label: "收入", value: "A" },
+              ]
+            },
+            {
+              label: "主单号",
+              ele: "el-input",
+              valueKey: "main_order_id",
+              value: "",
+              placeholder: "请输入主单号",
+            },
+            {
+              label: "订单类型",
+              ele: "xd-select-list",
+              valueKey: "is_gift",
+              value: "",
+              placeholder: "请选择订单类型",
+              list: [
+                { label: "全部", value: "" },
+                { label: "礼包", value: "Y" },
+                { label: "非礼包", value: "N" },
+              ],
+            },
+            // {
+            //   label: "供货商",
+            //   ele: "el-input",
+            //   valueKey: "supplier_name",
+            //   value: "",
+            //   placeholder: "请输入供货商名称",
+            // },
+            {
+              label: "供货商:", //label
+              ele: "slot", //package 名称
+              slot: "time",
+            },
+            {
+              label: "时间:", //label
+              ele: "xd-date", //package 名称
+              valueKey: ["start_time", "end_time"], //form[valueKey]
+              value: [], //v-model
+              format: "yyyy-MM-dd HH:mm:ss", //时间显示格式
+              formatValue: "timestamp", //输出时间格式
+              placeholder: ["开始时间", "结束时间"],
+            },
+          ];
+      }).catch(err=>{
+        console.log(err,'err');
+      })
+    },
+    /**
+     * @description 翻页处理方法
+     * @param page {Number} 访问页面页码数
+     */
+    handlePagination(page) {
+      this.page_token = page;
+      this.getList();
+    }, //todo
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.list_header {
+  .total_wrap {
+    font-size: 13px;
+    margin-left: 30px;
+  }
+  .amount_wrap {
+    margin-right: 20px;
+    .amount_label {
+      font-size: 14px;
+      font-weight: 500;
+    }
+  }
+}
+.table-stat {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  p {
+    margin: 0;
+    font-weight: 500;
+    font-size: 14px;
+    ._mo {
+      font-weight: 400;
+      margin-right: 20px;
+      font-size: 12px;
+    }
+  }
+}
+.flex {
+  display: flex;
+  align-items: center;
+}
+.table-product {
+  display: flex;
+  align-items: center;
+  .table-product__img {
+    width: 50px;
+    height: 50px;
+    img {
+      width: 100%;
+      height: 100%;
+    }
+  }
+  .table-product__id,
+  .table-product__name {
+    width: 120px;
+    p {
+      width: 100%;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      margin: 0;
+    }
+  }
+}
+</style>
+